Supongamos que tengo diez imágenes con diferentes data-index pero la misma class y src como:

 <img src="images/image.png" class="image" data-index="${index})">

Y quiero llegar al data-index de la imagen en la que se hizo clic con eventListener

 const image= document.getElementsByClassName('image'); image.forEach(el => el.addEventListener('click', function() { console.log(el.getAttribute('data-index')); }));

Pero aparece el error que dice image.forEach is not a function . ¿Como puedo resolver esto? ¿Cómo puedo obtener el data-index de la imagen en la que se hizo clic? Esta tarea debía realizarse con eventListener . No se puede hacer con onClick porque, de lo contrario, algunas otras partes están fallando. Además, estas imágenes se imprimen utilizando innerHTML en código JS.

Entonces, básicamente, tengo imágenes con los mismos atributos pero no data-index . ¿Cómo puedo llegar al data-index de la imagen en la que se hizo clic?