Attach one listener on a stable parent; handle events from children via event.target—scales for dynamic lists.
Pattern
List ul listens for clicks; check event.target.closest('li') to find row.
Benefits
Fewer listeners, works for elements added later without rebinding.
Important interview questions and answers
- Q: Why delegation?
A: Dynamic rows and performance on large lists. - Q: closest()?
A: Finds nearest ancestor matching selector—including self.
Self-check
- Why one parent listener?
- When is target not the element you care about?
Tip: Re-run the playground code for event-delegation and tweak one line before the MCQs.
Interview prep
- Why delegate?
One listener for many dynamic children.