ausklappbarer Menübereich jQuery

Tag

Ich beschäftige mich derzeit mit einem kleinen Problem.

Ich habe ein kleines vertikales Menü eingerichtet:

<div id="nav_v">
  <div id="dot1"><a href=""><img src=""></a></div>
  <div id="dot2"><a href=""><img src=""></a></div>
  <div id="dot3"></div>
    <div id="dot3_hide" style="display:none;"></div>
  <div id="dot4"><a href=""><img src=""></a></div>
</div>

Nun habe ich mit Hilfe von jQuery etwas kleines gebastelt, dass wenn ich "dot3" anklicke sich ein Untermenü auftut aus dem Unterpunkte gewählt werden können.

jQuery Code:

var stat = false;
$("#dot3").click(function() {
      if(stat == true) {
         $("#dot3_hide").hide(300)
         stat = false;
      }
      else if(stat == false) {
         $("#dot3_hide").show(300);
         stat = true;
      }
});

Das funktioniert auch alles wunderbar.

Zum Problem:

Ich will, dass wenn ich jetzt einen anderen Link im Menü anklicke (z.B. dot1, dot2, ...), dass "dot3_hide" weiterhin offen bleibt. Momentan verschwindet nämlich "dot3_hide" wieder, weil die Seite ja aktualisiert wird.

Ich hab auch schon ein paar Ideen, aber die klingen alle ganzschön kompliziert. Ich denke da muss es bestimmt auch eine "schöne kleine" Möglichkeit geben.

Habt ihr Rat? Schonmal Danke.

MfG XantypiaxD

stimmt wohl.. Danke Damit lässt sich was anfangen.