Question

I have a situation where I need to identify if a list element (li) has a sub (ul) underneath it, and if it does, I need to change the background image of the anchor tag (a) under the (li) to display a sub-menu indicator image (say subMenuImg.gif). All the anchor tags (a) have a css class of “menuLink”, if there is a sub-menu for that list element (li), I would like to change it to subMenuLink. I can then apply the styles on this sub-menu link as needed.

How can I best do it with jQuery?

Answer 1

You could get a list of li with ul underneath it with:

$("li:has(ul)")

Then you can apply a different style to each immediate child of the li with

$(this).find(">a").addClass("hasSubmenu");

Put it all together like this.

$("li:has(ul)").each(function(){
    $(this).find(">a").addClass("hasSubmenu");
});