Klassen automatisch nummerieren

[EduDeLuxe]

Hallo zusammen,

ich versuche gerade die Klassen der Listeneinträge eine Liste automatisch zu nummerieren.
Das klappt auch. Allerdings sind in der Liste wiederum Listen verschachtelt. Diese werden auch nummeriert. Allerdings möchte ich nur die Listeneinträge der obersten Hierarchie nummerieren.

Hier findet Ihr ein Beispiel: http://jsfiddle.net/VQxMS/

Die Listeneinträge der obersten Hierarchie habe ich mit class="item" benannt - und nur diese sollen nummeriert werden.
Leider finde ich keinen Weg das JS auf die besagten Listeneinträge zu beschränken.

var list = document.getElementById("mega").getElementsByTagName("li").getElementsByClassName("item");

hat keine Wirkung - hier wird nichts nummeriert.

Ich bin für jeden kleinen Tipp dankbar.

Gruß
Edu

 

[eptical]

Tipp: Benutze einfach jQuery. Dort selektierst du wie mit CSS - dann sollte es ja kein Problem mehr sein, oder?

 

[tombe]

So geht es zwar:

var list = document.getElementById("mega").getElementsByTagName("li");
for (var i = 0; i < list.length; i++) {
	if (list[i].className == "item"){
		list[i].className = "menu-item-" + i;
	}
}

Aber das was du da vor hast kommt mir trotzdem ein wenig komisch vor.

Hast du wirklich so viele verschiedene CSS-Klassen das für jeden Eintrag etwas anderes gilt?

Oder willst du vielleicht die Listeneinträge selber nummerieren?

 

[EduDeLuxe]

Vielen Dank für Eure Hilfe,

mag schon sein, dass es ein wenig seltsam wirkt, aber ist schon OK so. Ich versuche ein Menü zu bauen, wie auf der aktuellen Amazon-Seite. Hierfür will ich mir die Option einräumen, die Kategorien unterschiedlich zu gestalten (Hintergrundbild, etc.)

übrigens, die Lösung von tombe ist nah dran, zwar werden nur die gewünschten <li> nummeriert aber ALLE <li> werden gezählt... mir wäre es lieber, wenn die zweite Hierarchie beim Zählen ebenfalls keine Beachtung fände.