Dodavanje event listener-a u petlji u JavaScript-u

U prethodnoj lekciji naučili smo da kreiramo nove elemente u petlji. Hajde sada da dodajemo event listener-e prilikom kreiranja novih elemenata.

Neka ponovo imamo ovaj parent div:

html<div id="parent"></div>

Pokrenimo petlju koja će na kraju našeg div-a dodati 9 novih paragrafa, i na svaki dodati event listener za klik:

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

for (let i = 1; i <= 9; i++) {
  let p = document.createElement('p');
  p.textContent = '!';
  
  // Dodajemo event listener za klik:
  p.addEventListener('click', function() {
    console.log(this.textContent);
  });
  
  parent.appendChild(p);
}