CSS-Klasse vs. direkte style-Angabe beim Element

[Andreas Heyer]

Hallo Forum!

Ich habe mir ein kleines Menü gebastelt, wo nach dem klicken auf einen Eintrag die Untermenüeinträge angezeigt werden. Dies funktioniert auch recht gut.
Hier ein kleiner Ausschnitt:

...
<p id="6">
  <a href="..." onclick='nav_section("6_1")'>Ebene 1</a>
  <blockquote id="6_1" style="position: relative; display: none; white-space: nowrap">
    <a href="..">Untermenüeintrag 1</a>
    <br>
    <a href="...">Untermenüeintrag 2</a>
  </blockquote>
</p>
...

Mit dem folgenden Script wird nach anklicken des Links der Ebene 1 das Untermenü (blockquote) ein- oder ausgebelendet:

function nav_section(section)
{
 var navdoc=top.navigation.document;
 var sec=navdoc.getElementById(section);

if(sec.style.display != "none")
  sec.style.display="none";
 else
  sec.style.display="block";

return void(0);

}
(Nutzung in einem Frameset)

Und wie gesagt, das funktioniert auch ohne Probleme. Nun wollte ich aber die style-Eigenschaften des blockqoutes auslagern und habe dafür eine Klasse blockquote.sec geschaffen:

blockquote.sec
{position: relative; display: none; white-space: nowrap}

Die blockquotes erhalten nun statt style="" die Angabe class="sec".
Doch nun muss ich zweimal auf einen übergeordeneten Menüeintrag klicken, damit das Untermenü angezeigt wird! Danach wechselt der zustand bei jedem Klick wie erwartet. Mit der direkten Styleangabe beim blockquote erfolgt schon wie gewollt beim ersten Klick das Erscheinen des Untermenüs.

Kann mir jemand sagen, warum das so ist und wie ich mit der CSS-Klasse ebenfalls eine Reaktion beim ersten Klick erreiche?

MfG
Andreas Heyer