How can I give a function to each div with a class

Viewed 39

Like how you can.

document.querySelectorAll('div').forEach((div) => {
  div.onclick = () => {
    console.log(this.dataset.id)
  }
});

How can i do it if div was a class .email How can i make it work?

and how can put a class and a dataset thorough Javascript because I created an element.

2 Answers

Refrain from using onclick, or any onEvent property on element. Instead, use element.addEventListener(eventType, callbackFn)

function printDatasetId(e){
    console.log(this.dataset.id);
}


document.querySelectorAll('.email').forEach(email => email.addEventListener('click', printDatasetId))
<p class="email" data-id="adam@hey.com">adam@hey.com</p>
<p class="email" data-id="jeff@hey.com">jeff@hey.com</p>

document.querySelectorAll('.myClass').forEach((element) => {
  element.onclick = () => {
    console.log("hello")
  }
});

Related