Problema Script mostrar/ocultar divs

[oNefl0w189]

Hola compañeros. Tengo un script el cual utilizo para mostrar o ocultar un div cuando pulsen un boton, vamos lo típico de +Info que lo que hace es al darle mostrar un div con un contenido y al volver a darle ocultarlo.

El problema es que son 3 divs distintos, y para abrir el tercero (p.e) primero tengo que abrir el primero y el segundo.
Yo lo que quiero es que den al que den se abra, independientemente de si los otros estan abiertos o no.

Os dejo el codigo:

Código Javascript:

<script language="JavaScript">
function muestra_oculta(id){
if (document.getElementById){ //se obtiene el id
var el = document.getElementById(id); //se define la variable "el" igual a nuestro div
el.style.display = (el.style.display == 'none') ? 'block' : 'none'; //damos un atributo display:none que oculta el div
}
}
window.onload = function(){/*hace que se cargue la función lo que predetermina que div estará oculto hasta llamar a la función nuevamente*/
muestra_oculta('contenido_a_mostrar');/* "contenido_a_mostrar" es el nombre que le dimos al DIV */
muestra_oculta('contenido_a_mostrar1');
muestra_oculta('contenido_a_mostrar2');
}
</script>
 

Los botones que ejecutan la funcion:

Código HTML:

<a class="button" style='cursor: pointer;' onclick="muestra_oculta('contenido_a_mostrar')"><span><span>+ Info</span></span></a>
<a class="button" style='cursor: pointer;' onclick="muestra_oculta('contenido_a_mostrar1')"><span><span>+ Info</span></span></a>
<a class="button" style='cursor: pointer;' onclick="muestra_oculta('contenido_a_mostrar2')"><span><span>+ Info</span></span></a>
 

Y los divs:

Código HTML:

<div id="contenido_a_mostrar">
<h2>Acerca de nuestros proyectos</h2>
</div>