Event Binding beim Einfügen von Elementen

Lassen Sie uns nun beim Einfügen von Elementen Event-Handler an sie binden.

Nehmen wir zum Beispiel an, wir haben dieses übergeordnete Element:

html<div id="parent">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Fügen wir am Ende dieses übergeordneten Elements einen weiteren Absatz hinzu und setzen einen Klick-Handler dafür:

javascriptlet parent = document.querySelector('#parent');

let p = document.createElement('p');
p.textContent = '!';

p.addEventListener('click', function() {
  console.log(this.textContent); // beim Klick geben wir den Text des Absatzes aus
});

parent.appendChild(p);