Good Morning Everyone, I am struggling a few hours with a problem, which solution isn't that easy as I initial though. The following example list is generated by backend code.
<ul id="nav"> <li> <a id="hyperlink" class="navlink" href="/home" title="">Home</a> </li> <li><a id="hyperlink" class="navlinkparent" href="" title="">Folder A</a> <ul> <li><a id="hyperlink" class="navsublinkparent" href="/folder_a/ page1" title="">Page1</a> </li> <li><a id="hyperlink" class="navsublinkparent" href="/folder_b/ page2" title="">Page2</a> </li> <li><a id="hyperlink" class="navsublinkparent" href="" title="">Folder B</a> <ul> <li> <a id="hyperlink" class="navsubsublink" href="/folder/page1" title="">Page1</a> </li> <li> <a id="hyperlink" class="navsubsublink" href="/folder/page2" title="">Page2</a> </li> <li> <a id="hyperlink" class="navsubsublink" href="/folder/page3" title="">Page3</a> </li> </ul> </ul> Thats only a shortened version. JQuery is used to create a horizontal dropdown menu. Up to this part everything is working as expected. To improve the usability I want to add two kinds of arrows to the menu. One arrow down for the top elements and one arrow right for child entries. That part should accomplished by the following snippets. $("ul > li > a.navlinkparent").css({ "background-image": "url(/img/nav_arrow_down.gif)", "background-repeat": "no-repeat", "background-position": "right center" }); $("#nav ul > li > a.navsublinkparent").css({ "background-image": "url(/img/nav_arrow_right.gif)", "background-repeat": "no-repeat", "background-position": "right center" }); The problem I am facing right know is, that not every parent has childs and therefor it shouldn't get an arrow assigned. I tried various filters but without any luck. Does anyone has a hint on solving? best regards, Gordon