Estoy tratando de hacer que esta hoja de preguntas frecuentes de estilo acordeón funcione. Hasta ahora, parece que solo puedo obtener el primer elemento para mostrar el contenido oculto. Aquí está mi js:
var arrowIcon = document.querySelector('.arrow-icon'); var hidden = document.querySelector('.hidden'); var answer = 'answer'; arrowIcon.addEventListener('click', function() { if (answer === 'hidden') { answer = 'answer'; hidden.setAttribute('class', 'answer'); } else { answer = 'hidden'; hidden.setAttribute('class', 'hidden'); } });Debe usar querySelectorAll y luego iterar a través de cada elemento y agregar un detector de clics. Tenga en cuenta que querySelectorAll devuelve una lista de nodos, no una matriz. Entonces, si desea utilizar toda la funcionalidad de la matriz, asegúrese de convertirla en una matriz.
Algo como esto debería funcionar:
var arrowIcon = Array.from(document.querySelectorAll('.arrow-icon')); arrowIcon.forEach(el => { el.addEventListener("click", => (event) { // Your Code Here }) });