##### ###### ##### ### # # ### # # ###### ## ## ## ## ## ## ## # # # # # ## ##### #### ##### # # # # # # # #### ## # ## ## ## ## # # # # # ## ## # ###### ## ### # ### # ######
##### ###### ##### ### # # ### # # ###### ## ## ## ## ## ## ## # # # # # ## ##### #### ##### # # # # # # # #### ## # ## ## ## ## # # # # # ## ## # ###### ## ### # ### # ######
Handle events on parent elements
Instead of adding listeners to many children, add one to the parent and check event.target.
ul.addEventListener("click", (e) => {
if (e.target.tagName === "LI") {
e.target.classList.toggle("selected");
}
});
This is more efficient and works for dynamically added elements.