Question

How to add an event listener to multiple elements in JavaScript

Answer 1

<div class="divclass">div 1</div>
<div class="divclass">div 2</div>
<div class="divclass">div 3</div>

const elements = document.querySelectorAll('.divclass');

elements.forEach(element => {
   element.addEventListener('click', (e)=>{     
   		console.log('div class');   
   });
});
   
   
   
       
       
/*
run:
   
"div class"
"div class"
"div class"
   
*/

 

70+ SQL courses for beginners and professionals

Answer 2

<div class="divclass1">div 1</div>
<div class="divclass2">div 2</div>
<div class="divclass3">div 3</div>

const element1 = document.querySelector('.divclass1');
const element2 = document.querySelector('.divclass2');
const element3 = document.querySelector('.divclass3');

[element1, element2, element3].forEach((element)=>{
   element.addEventListener('click', (e)=>{     
   		console.log('div class');   
   });
});
   
   
   
       
       
/*
run:
   
"div class"
"div class"
"div class"
   
*/
  

 

70+ SQL courses for beginners and professionals