Why am I unable to apply "Event Delegation" in this project?
Project link: https://astonishing-cupcake-035f30.netlify.app/
Hello, when I try to add event listener to the parent div, or even whole body, it does not work.
I'm guessing it's due to the way I'm adding elements with JSON, but I'm not sure myself.
Any help would be appreciated!
P.S. Guide I used for "Event Delegation" is one I received here!
Guide link: https://gomakethings.com/listening-for-events-on-multiple-elements-using-javascript-event-delegation/
Listening for events on multiple elements using JavaScript event de...
In JavaScript, event listeners have to be attached to individual elements. You can’t attach them to an array or node list of matching elements like you might in jQuery.
Today, we’re going to look at a technique that you can use listen for the same even on multiple elements without having to attach to each element individually: event delegation.
...
6 Replies
This isn't event delegation. You're adding an event listener on dang near every single element.
What you do is add one event listener on the parent element. Most likely the
main
element since it seems that's the only one that is actually on the page when it loads.@cvanilla13eck I did that and it does not work. I just linked project so you can see how I added JSON. But yeah I should have explained that I have no Event Delegation because it does not work. (There is commented one I tried I think)
If it’s not working then you’re doing something wrong.
Can you make a codepen with a basic version of your site so we can see where the error is?
How do I add JSON with codepen?
Is the project link not working?
JSON is on the bottom of JS