What is event delegation in JavaScript?

Event delegation is a technique where you attach a single event listener to a parent element to handle events for multiple child elements, using event bubbling.

Example:

// Instead of adding listeners to each button
document.getElementById("parent").addEventListener("click", function(e) {
  if (e.target.tagName === "BUTTON") {
    console.log("Button clicked:", e.target.textContent);
  }
});

Benefits:
1. Performance - Fewer event listeners
2. Memory efficiency - Less memory usage
3. Dynamic elements - Works with elements added later
4. Cleaner code - Single event handler

Use cases:
- Lists with many items
- Dynamically generated content
- Tables with many rows
- Navigation menus

Event object properties:
- e.target - element that triggered event
- e.currentTarget - element with event listener
- e.stopPropagation() - stop bubbling