javascript - 如何在里面包装和重新排序元素？

Question

我正在尝试用 jQuery 将一些元素包装在一个 li 元素中。我的问题是我想切换它们在 li 中的顺序。现在是li开始 - a- div-li结束，但我要li开始 - div- a-li结束。

我怎样才能做到这一点？我尝试了一切，但没有奏效。这是我当前的代码：

$('a.top_link+div.sub').not(":first").each(function() {
  $(this).prev().andSelf().wrapAll('<li class="aaa">');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="something.com" class="top_link">Something</a>
<div class="sub">Some other content..</div>

我想包装它并重新排序内容，如下所示：

<li class="aaa">
  <div class="sub">Some other content..</div>
  <a href="something.com" class="top_link">Something</a>
</li>

上面的元素不止一个，只是内容不同（菜单的一部分）。

Answer 1

这应该有效：

$('a.top_link+div.sub').each(function () {
    $(this).insertBefore($(this).prev()).add($(this).next()).wrapAll('<li class="aaa">');
});

对于每个div.sub，上面的代码都会：

1. 把它移到前面<a>
2. 添加<a>到集合中
3. 将两者都包裹在一个<li>

演示：http: //jsfiddle.net/vjC3x/