jQuery-一次拖动/排序两个元素

我正在使用一个有点复杂的联系人列表管理器，它涉及类别和子类别。我现在正试图在混合中实现排序。我的HTML如下所示：

<li>List item</li>
<ul class="subcategory">
     <li>List item</li>
     <li>List item</li>
     <ul class="subcategory">
          <li>List item</li>
          <li>List item</li>
     </ul>
</ul>
<li>List item</li>
<li>List item</li>

列表项

列表项
列表项

列表项
列表项


列表项
列表项

---

现在，当用户想要移动列表项时，其子类别也应该随之移动（如果有）。到目前为止，我已经尝试了

.wrap（）

-在一个div中对每个列表项及其子类别进行排序，然后使该div可排序，但是效果不是很好。也许jQuery中有更好的解决方案？也许我的HTML的结构会有所不同？

仅供参考，您的HTML无效。一个

不能包含另一个

（它需要在

中）。我有一种感觉，它将归结为我的HTML，我甚至没有想到它将如何验证。将

包含在
中也会使排序更容易。