Question

我有简单的无序列表菜单。代码在下面，您可以从jsFiddle获取它：

<ul>
    <li><a href="#">First</a></li>
    <li><a href="#">Second</a>
        <ul>
            <li><a href="#">Second - 1</a></li>
            <li><a href="#">Second - 2</a></li>
            <li><a href="#">Second - 3</a>
                <ul>
                    <li><a href="#">Aaa</a></li>
                    <li><a href="#">Bbb</a></li>
                    <li><a href="#">Ccc</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="#">Third</a></li>
</ul>

我想使用jQuery将此标记<span class="arrow"></span>添加到包含子菜单的所有菜单，所有父菜单。在这种情况下，应在第二和第二 - 2 菜单链接之后添加此代码，如下所示：

<ul>
    <li><a href="#">First</a></li>
    <li><a href="#">Second</a><span class="arrow"></span>
        <ul>
            <li><a href="#">Second - 1</a></li>
            <li><a href="#">Second - 2</a></li>
            <li><a href="#">Second - 3</a><span class="arrow"></span>
                <ul>...........

任何建议最简单的方法是什么？

谢谢！

Answer 1

$('li > ul').before('<span class="arrow"></span>');

Answer 2

$('li').has('ul').children('a').append('<span class="arrow"></span>');

使用jQuery自动向所有父菜单添加箭头

2 个答案: