Fügen Sie eine Klasse mit jQuery zu bestimmten Menüelementen hinzu, wenn Sie den Mauszeiger halten - javascript, jquery, toggleclass, menu-items

Beim Schweben eines Menüs mit Bildern möchte ich einKlasse mit jQuery zum spezifischen Menüpunkt. Die Menüpunkte haben Item-IDs, die an anderer Stelle hartcodiert sind. Der Code darunter funktioniert, aber ich muss jeden spezifischen Menüpunkt codieren, und das ist nicht meine Absicht.

jQuery(document).ready(function(){
jQuery(".menu > li.item-447 > a").hover(function() {
jQuery(".menu > li.item-447 > a > span").toggleClass("nav-label");
});
jQuery(".menu > li.item-449 > a").hover(function() {
jQuery(".menu > li.item-449 > a > span").toggleClass("nav-label");
});
jQuery(".menu > li.item-... > a").hover(function() {
jQuery(".menu > li.item-... > a > span").toggleClass("nav-label");
});
});

Ich habe diesen Code ausprobiert, aber beim Schweben bekommen alle Menüpunkte die Zusatzklasse "nav-label".

jQuery(document).ready(function(){
jQuery(".menu > li.item > a").hover(function() {
jQuery("a", this);
jQuery( ".menu > li > a > span" ).toggleClass( "nav-label" );
});
});

Irgendwelche Vorschläge?

Antworten:

Sie können einen bestimmten Menüpunkt erhalten this Schlüsselwort und Verwendung jQuery(this) um es in ein jQuery-Objekt umzuwandeln.

Versuche dies:

jQuery(document).ready(function(){
jQuery(".menu > li > a").hover(function() {
jQuery(this).children("span").toggleClass("nav-label");
});
});