can i have an onclick event on a imagemap area element

Question

I would like to put an onclick event on an area element. Here is my setup:

Answer 1

Use a class for all elements you want to listen on, and optionally an attribute for behavior:

Then add your event listeners to all elements in the class:

const popable = document.querySelectorAll('.popable');
const popup = document.querySelector('.popup');
let lastClicked;

popable.forEach(elem => elem.addEventListener('click', togglePopup));

function togglePopup(e) {
  popup.innerText = e.target.dataset.text;

  // If  clicking something else, first restore '.hidden' to popup so that toggle will remove it.
  if (lastClicked !== e.target) {
    popup.classList.add('hidden');
  }
  popup.classList.toggle('hidden');
  lastClicked = e.target;  // remember the target
}

Demo: https://codepen.io/weird_error/pen/xXPNOK