Welcome to the Treehouse Community
Looking to learn something new?
Ruth O'Kelly4,944 Points
Still not understanding the concept.
I am still trying to understand the concept of Event Delegation and Propagation. Why does the button not work in the initial scenario? I would have thought that by the time we click the button, the rest of the JS code has run and therefore the button has been created and is now ready to use?
Steven Parker220,450 Points
The initial issue is caused by the order of the code. It has all run before you click on the button, but while it was running, it tried to attach event handlers when there were no buttons, and then created the button.
So the button itself is there, but it has no event handler to react to being clicked.
Tyler Dix14,230 Points
As I understand this, the difference to really pay attention to is what event you're telling the JS interpreter to listen to. Before, it was:
And because that button was appended AFTER the event listener, it's basically listening for something that doesn't' exist.
With the change to:
...it's now listening for the spoiler element, which DOES exist. This helped clarify this concept for me.