Use event listener on parent.

[QBitFoundry]

Use event delegation (usually better)

Attach a single listener to a parent element that already exists:

document.body.addEventListener('click', (event) => {
  if (event.target.matches('.btn')) {
    handleClick(event);
  }
});

Now any current or future .btn element will work automatically.

[QBitFoundry]

For DOM modifications, use a MutationObserver:

const observer = new MutationObserver((mutations) => {
  console.log('DOM changed', mutations);
});

observer.observe(parent, {
  childList: true,  // added/removed children
  subtree: true,    // descendants too
  attributes: true, // attribute changes
  characterData: true // text node changes
});

It will fire when:

• A child element is added
• A child element is removed
• Text content is edited via JavaScript
• Attributes change