Tengo este acordeón abriendo todas las pestañas al mismo tiempo, pero quiero que abra una pestaña a la vez y cuando haces clic en otra pestaña, cierra la pestaña anterior. Traté de jugar con el javascript, pero lo único que puedo obtener es que la pestaña no se abre por completo.
var acc = document.getElementsByClassName("accordion"); var i; for (i = 0; i < acc.length; i++) { acc[i].addEventListener("click", function() { this.classList.toggle("active"); var panel = this.nextElementSibling; if (panel.style.maxHeight) { panel.style.maxHeight = null; } else { panel.style.maxHeight = panel.scrollHeight + "px"; } }); } <button class="accordion">Section 1</button> <div class="panel"> <p>CONTENT 1</p> </div> <button class="accordion">Section 2</button> <div class="panel"> <p>CONTENT 2</p> </div> <button class="accordion">Section 3</button> <div class="panel"> <p>CONTENT 3.</p> </div>