Text sichtbar/unsichtbar

[Gerhard-Anfänger]

Moin, bisher hatte ich folgendes HTML.

<ul>  
   <li><a href="#id1">Abteilung1</a></li>  
   <li><a href="#id2">Abteilung2</a></li>  
   <li><a href="#id3">Abteilung3</a></li>  
   <li><a href="#id4">Abteilung4</a></li>  
</ul>  

<h1 id="id1">Abteilung1</h1>  
.........

<h1 id="id2">Abteilung2</h1>  
.........

<h1 id="id3">Abteilung3</h1>  
.........

<h1 id="id4">Abteilung4</h1>  
.........

Dabei konnte man durch Scrollen alles ansehen. Nun möchte ich aber, dass bei einem Klick auf einen Link nur der zugehörige Text erscheint. Wie kann ich das realisieren?