Question

I try to select a link in a browser if this link is available in a sub-menu when I select the link with the parent class: hasSubMenu
My problem is that many links are selected when I do not want one…

<li style="z-index: 100;" class=""><a href="/#" class="hasSubMenu" style="background: none repeat scroll 0pt 0pt rgba(114, 130, 143, 0.17); color: rgb(68, 68, 68);">A propos<span class="subDown"></span></a><ul class="sub-menu" style="top: 32px; visibility: visible; left: 0px; width: 187px; display: none;"><li><a href="/contactez_nous.php" style="background-color: rgb(248, 196, 96); text-shadow: none; margin: 0pt; text-decoration: none; padding-left: 6px;">Contact</a></li><li><a href="/page.php?4" style="padding-left: 6px;">Mentions légales</a></li><li><a href="/page.php?5" style="padding-left: 6px;">Partenaires</a></li></ul><ul class="sub-menu" style="display: none; visibility: visible;"><li><a href="/contactez_nous.php" style="background-color: rgb(248, 196, 96); text-shadow: none; margin: 0pt; text-decoration: none;">Contact</a></li><li><a href="/page.php?4">Mentions légales</a></li><li><a href="/page.php?5">Partenaires</a></li></ul></li>

Jquery:

var exploded = window.location.href.split('/');
// alert(exploded[3]);
$('ul.sub-menu li a').each(function(){
    var items = $(this).attr('href');
    var item_clean = items.substring(1, items.length);
    if(item_clean == exploded[3]){
        $(this).parents().find('a.hasSubMenu:first').attr('style','background: rgba(114, 130, 143, 0.17) none repeat scroll 0 0;color: #444444;');
        $(this).attr('style','background-color:#F8C460;text-shadow:none;margin:0;text-decoration:none;');
    }
});

Thx for your answers

Answer 1

For your jQuery selector, use $('ul.sub-menu li a:first').