Div ein/aus blenden

[günther g.]

Hallo

Ich brauche auf meiner Website die funktion Div-tags per Click ein und auszublenden.

Ich hab eine Liste von Menüpunkten und sobald ich auf einen Menüpunkt klicke soll unter der Liste das dazugehörige div ein geblendet bzw. ausgeblendet werden. Dass das ganze mit display:block/none funktioniert ist mir klar und ich denke das mein html code dazu auch geeignet ist. Meine Javascript kentnisse sind halt etwas bescheiden und ich hab ehrlichgesagt keinen Plan wie ich das realisieren soll.
Eventuell kann mir ja wer auf die weiterhelfen.

Die funktion soll folgendes machen:

-Bei Seitenaufruf alle divs auf class="geschlossen" stellen. (damit user   ohne javascript auch was sehen sind sie standart auf class="geöffnet"

-Wenn man auf den entsprechenden Menüpunkt klickt soll die funktion einfach umschalten. Also wenn "geschlossen" ist soll es sich ändern auf "geöffnet" und umgekehrt.
das ganze über die ID des div elements

Html Code:

  
<ul>  
 <li>Punkt 1</li>  
 <li>Punkt 2</li>  
 <li>Punkt 3</li>  
</ul>  
  
<div id="punkt1" class="geöffnet">  
 <h1>Punkt1</h1>  
 <p>text1</p>  
<div>  
  
<div id="punkt2" class="geschlossen">  
 <h1>Punkt2</h1>  
 <p>text2</p>  
<div>  
  
<div id="punkt3" class="geschlossen">  
 <h1>Punkt3</h1>  
 <p>text3</p>  
<div>  

CSS-Datei

  
.geöffnet {  
display:block;  
}  
  
.geschlossen {  
display:none;  
}