Мне нужна помощь с указанием LI верхнего уровня только с использованием jQuery

Question

Я пытаюсь ограничить функцию добавления, чтобы она применялась только к LI верхнего уровня, но я, очевидно, понятия не имею, как сделать это выборочным. Я искал последние несколько дней в надежде найти что-то, что приведет меня в правильном направлении, но пока не повезло ...

Я хочу, чтобы стрелка вниз использовалась только на верхнем уровне, а стрелка вправо - на последующих LI. Надеюсь, это будет иметь смысл. Вот код, который я использую.

$("ul.dropdown li:has(ul)").find("a:first").append('<img class="down_arrow" border="0" style="padding-left:3px;" src="http://nunyabiz.zxq.net/img/down.gif" />')
$("ul.dropdown li ul li:has(ul)").find("a:first").append('<img class="right_arrow" border="0" style="padding-left:3px;" src="http://nunyabiz.zxq.net/img/right.gif" />');

Чтобы увидеть полный код: http://nunyabiz.zxq.net/menu/index.html

Answer 1

с помощью Child Selector («родитель> потомок») селектор

$("ul.dropdown > li:has(ul)").find("a:first").append(
    $("<img>", { 
        "class": "down_arrow", 
        border: 0, 
        style: "padding-left:3px;", 
        src: "http://nunyabiz.zxq.net/img/down.gif"
    })
);

или как у вас это было:

$("ul.dropdown > li:has(ul)")
    .find("a:first")
    .append('<img class="down_arrow" border="0" style="padding-left:3px;" src="http://nunyabiz.zxq.net/img/down.gif" />')

, что просто нормально