html-lists - 在可排序列表中包含组并在添加动态列表时移动所有列表元素

Question

我正在努力让这个功能运行，但是在某个地方或其他地方，我的整体逻辑中缺少。如果有人可以帮助我或指导我，我将不胜感激。我将我的问题分为两部分。

第1部分

我曾多次使用两个可排序列表，但这次我只有一个可排序列表，并且希望获得条件排序。.

条件排序解释如下：

<div id="awesome">
 <ul>
  <li class="alpha">A</li>
  <li class="alpha">D</li>
  <li class="alpha">T</li>
  <li class="math">1</li>
  <li class="math">3</li>
  <li class="math">2</li>
 </ul>
</div> 

在上面的示例中，如果用户尝试将“数学”列表放在两个 alpha 列表之间，我想阻止他们。它们应该只能在自己的组内进行排序。在我的示例中，用户可以在 1 之前带 2，反之亦然，但在组间。

第 2 部分：另外，如果我想添加一个动态 alpha 列表，它应该附加在最后一个 aplha 列表之后（我可以使用 last() 功能通过与它们的类名进行比较来做到这一点）但是我如何移动所有其他列表元素相应地对吗？如果有人删除，则向左移动。

我知道这可以通过纯 Jquery 使用任何插件来实现。

提前致谢。