I’m trying to figure out how to loop through divs in the Template that have .myclass and then do some modifying of the element. How do I loop through and find each of those elements - I guess using Hooks?
you can’t execute javascript in the editor, so you won’t be able to loop over DOM elements whilst inside of Elements.
Ideally you want as little DOM manipulation as possible, and instead move any logic/data manipulation in to the hooks file so we keep the templates as simple as possible.
Depending on what you’re trying to achieve, you could set an object/array/variable(s) in the hooks file and then use an @each
loop in your template to generate the appropriate HTML.
But I’d need to know what your use case is here before I could give a better answer.
@bon Ok very simple layout in edit mode:
<div id="text" class="w-full h-[350px] gap-2 p-1">
<div class="pos1 outer relative text-sky-400"></div>
<div class="pos2 outer relative text-sky-400"></div>
</div>
I want to loop through all the .outer classes in edit mode and find the one with class ‘pos2’ and then as an example change the text color.