Olá!
Estou tendo dificuldades em fazer com que ao apertar o botão de collapse seja substituído o conteúdo.
Quando clico o conteúdo que já está ativado continua na página e o que eu ativei aparece ou em cima ou embaixo. A minha intenção é fazer a troca e não manter todas as informações juntas.
Clicou, ativou. Clicou em outro, substitui o conteúdo.
Javascript:
function Conteudo(el){
var display = document.getElementById(el).style.display;
if(display == "none")
document.getElementById(el).style.display = 'block';
else
document.getElementById(el).style.display = 'none';}
Html:
<form style="display: inline" method="get">
<button id="btn-essencial" type="button" onclick="Conteudo('container-linha-essencial')" class="on-button-essencial off-button-essencial"><h2>Linha <b>Essencial®</b></h2></button>
</form>
<form style="display: inline" method="get">
<button id="btn-pro" type="button" onclick="Conteudo('container-linha-pro')" class="on-button-pro off-button-pro"><h2>Linha <b>Pro®</b></h2></button>
</form>
<form style="display: inline" method="get">
<button id="btn-premium" type="button" onclick="Conteudo('container-linha-premium')" class="on-button-premium off-button-premium"><h2>Linha <b>Premium®</b></h2></button>
</form>
</div>
</section>
...
...
...