Estoy tratando de cambiar este script js para que funcione de la siguiente manera: necesito ocultar otra sección y el mismo botón al mismo tiempo se muestra en la sección que ya funciona.
¿Alguien puede señalarme en la dirección correcta? Me encantaría saber qué poner en el JS ya que soy un novato en codificación total y no puedo imaginarme cómo resolverlo.
function showStores() { var x = document.getElementById("allstores"); if (x.style.display === "none") { x.style.display = "block"; } else { x.style.display = "none"; } } <button onclick="showStores()">See All Stores</button> <div id="allstores">All stores</div>Alternar lo oculto
También use el addEventListener recomendado en lugar del clic en línea
document.getElementById("toggle").addEventListener("click",function() { const x = document.getElementById("allStores"); const y = document.getElementById("someStores"); x.hidden = !x.hidden y.hidden = !y.hidden this.innerText = x.hidden ? 'See all stores' : 'See some stores' }) <button type="button" id="toggle">See All Stores</button> <div id="allStores" hidden>All stores</div> <div id="someStores">Some stores</div>Si no te gusta .hidden puedes usar una clase
document.getElementById("toggle").addEventListener("click",function() { const x = document.getElementById("allStores"); const y = document.getElementById("someStores"); x.classList.toggle("hide") y.classList.toggle("hide") this.innerText = x.classList.contains("hide") ? 'See all stores' : 'See some stores' }) .hide { display: none; } <button type="button" id="toggle">See All Stores</button> <div id="allStores" class="hide">All stores</div> <div id="someStores">Some stores</div>