te dejo un ejemplo para que veas como funciona y lo estudies para saber como adaptarlo a tu caso
Código CSS:
Ver original.oculto{display:none;}
.visible{display:block;background:#fe0;}
Código HTML:
Ver original<div onclick="mostrar('n5');">contenido div n4
</div> <div class="oculto" id="n5">contenido div n5
</div>
Código Javascript
:
Ver originalfunction mostrar(id){
var MostrarID = document.getElementById(id);
if(MostrarID.className == 'oculto'){
MostrarID.className = 'visible';
}
else{
MostrarID.className = 'oculto'
}
}
o talvez en lugar de clases prefieras insertar el css en linea
Código HTML:
Ver original<div onclick="mostrar('n5');">contenido div n4
</div> <div class="oculto" id="n5" style="display:none;">contenido div n5
</div>
Código Javascript
:
Ver originalfunction mostrar(id){
var MostrarID = document.getElementById(id);
if(MostrarID.style.display == 'none'){
MostrarID.style.display = 'block';
}
else{
MostrarID.style.display = 'none'
}
}