如何使用jquery将菜单包装到子菜单中？

Question

this is my site.

this is how I finally make it look like

我想将菜单列表项分成两个子菜单左右菜单。然后将它们包装在div中。这使我很容易对它们进行设计，这样它们也能保持响应。

现在，我一直试图通过

实现这一目标

jQuery( ".menu-item-580", ".menu-item-583",".menu-item-584",".menu-item-563").wrapAll("<div class='new' />").after(".menubar-brand");

我在浏览器控制台中试过这个。

我还使用appendTo()代替after()

尝试了相同的代码

但是，仍然没有运气。

Answer 1

在您的代码中，您基本上是这样做的：

<ul>
    <li>
    <div class="new">
        <li>
        <li>
    </div>
    <li>
</ul>

这不是有效的标记。

集合<li>的最简单方法是将不同的附加css类分配给列表的不同部分：

<ul>
    <li class="group1">
    <li class="group1">
    <li class="group2">
    <li class="group2">
</ul>

另外，请看一下：Is there a way to group `<li>` elements?