event delegation
A parent listener handles suitable events from descendants.
Use this when A dynamic list needs shared handling for events from its rows.
without the term
“Clicks work on the list items that were there at load, but new items added later don't respond. Can you make clicks work for all of them without adding a listener to each one?”
with the term · How do you ask a model for event delegation?
Delegate this list interaction to its stable container. Test nested click targets, newly inserted rows, and cleanup when the container is removed.
What is event delegation?
Events bubble up from the element clicked to its ancestors, so one listener on a stable container can handle clicks on rows that are added later.
Why does event delegation matter when vibe coding?
A listener attached only to initial children can miss rows inserted later.
How do you do event delegation?
Handle the relevant event at a stable ancestor and resolve the intended target within that boundary.
What goes wrong with event delegation?
Assuming every event bubbles or trusting a target outside the intended container.