Intentando abrir y cerrar un acordeón con JavaScript. Esto es lo que tengo hasta ahora, pero no funciona. Realmente no puedo encontrar el error (¡sé que hay uno!)
const sContent = document.getElementsByClassName("content"), sHeader = document.querySelectorAll(".header"); function toggleSki() { let itemClass = this.parentNode.className; for (i = 0; i < sContent.length; i++) { sContent[i].className = "content close"; } if (itemClass === "content close") { this.parentNode.className = "content open"; } } sHeader.forEach((el) => { el.addEventListener("click", toggleSki); }); .close .list { height: 0; overflow: hidden; transition: 0.3s; } .open .list { height: auto; margin-bottom: 2.5em; ; } .open .arrow { transform: rotate(-180deg); } <div class="content close"> <div class="header"> <div class="title"> <h3>headline</h3> <span>Sub title</span> </div> </div> <div class="list grid"> <div class="data"> <div class="titles flex"> <h4 class="name">ABC</h4> <p class="number">100%</p> </div> <div class="bar"> <div class="perc bg"></div> <div class="bar_bg 4d"></div> </div> </div> </div> </div>en caso de que su código aún no se ejecute en su entorno. Creo que el problema podría ser que su ciclo for pierda una declaración de variable:
for ( sea i = 0; i < sContent.length; i++)
debe resolver las dificultades