link a div che compare e appare

[ardand]

Ciao a tutti,
ho il seguente codice che funziona:

<script> 
function sol1() {     
var e = document.getElementById("sol1");     
if (e.style.visibility == 'hidden') {         
e.style.visibility = 'visible';         
e.style.display = 'block';     
} else {         
e.style.visibility = 'hidden';         
e.style.display = 'none';     
} } 
</script> 

mentre sul div appunto richiamo la funzione sol1:

[url="#"]Leggi il dettaglio della soluzione[/url]<div id="sol1"> Io scompaio e appaio! </div> 

Solo che quando carico la pagina il contenuto del div è già visibile ed io vorrei invece che fosse hidden e solo dopo il click che fosse visibile. Ho fatto diverse prove ma senza risultato.
Quancuno sa darmi indicazioni in merito?
Grazie