llamo por medio de document.querySelectorAll('p'), esto me arroja un array. y luego creo un for para recorrer cada elemento del array y a cada elemento de array le agrego un método addEventListener(), por lo tanto la función que ejecuta, permite crear un style background-color a todos los <p>
,pero al momento de crear las instrucciones de la función, me dice que es la propiedad style esta undefined
¿cómo puedo mejorar el código para que pueda agregar estos estilos al invocar el evento?
var p = document.querySelectorAll('p');
for (var i = 0; i < 3; i++){
p[i].addEventListener('mouseover', function () {
// console.log(p[i]);
p[i].style.backgroundColor = 'green';
});
}
p {
text-align: center;
font-size: 1.5em;
font-family: sans-serif;
}
<section>
<article>
<p>Contenidos pagina 1</p>
<p>Contenidos pagina 2</p>
<p>Contenidos pagina 3</p>
</article>
</section>