JavaScript · DOM and events

Event delegation

Attach one listener to a container and read event.target to handle clicks on its children. Works for dynamic content.

javascriptRunnable example javascript course

Syntax

list.addEventListener(type, handler)

Example

Try it

const list = document.createElement("ul");
list.addEventListener("click", (event) => console.log(event.target.tagName));
const item = document.createElement("li");
list.append(item);
item.click();

Learn this in the course

Reference pages are the quick answer. The course explains the why, shows the full example and ends with a challenge.

Open the course

Event delegation

Example

More in this group

Learn this in the course