Avatar ·

How to attach event handlers to dynamically created elements in JavaScript?

Hello everyone! I'm a beginner in JavaScript and I've encountered a problem that I can't seem to solve. I have a to-do list. The user can add new items through a form. Each list item should contain a "Delete" button so that a specific task can be removed. The problem is that when I add a new list item dynamically through JavaScript (for example, using `innerHTML` or `createElement`), the click handler on the "Delete" button doesn't work. The handlers only work for elements that were originally in the HTML. Here's a simplified code that demonstrates the problem: ```html
  • Task 1
  • Task 2