Javascript jQuery使用div将长ul列表拆分为较小的列表

我发现他和ul to li合作得很好

这是我的代码：

    <div id="submenu-last" class="popover">
        <div class="popover-content">
            <div class="listCol">
                <ul id="bigList">
                    <% _.each(depList.getAll(),function(dep){ %>
                        <li><a href="#"><%=dep.Name%></a></li>
                    <% }); %>
                </ul>
            </div>
        </div>
    </div>

   $(document).ready(function () {
        $(function(){
          var $bigList = $('#bigList'), group;
          while((group = $bigList.find('li:lt(20)').remove()).length){
            $('<div class="listCol"><ul>').append(group).appendTo($('.popover-content'));
          }
   });

$（文档）.ready（函数（）{
$（函数（）{
变量$bigList=$（'#bigList'），组；
while（（group=$bigList.find（'li:lt（20）'）.remove（））.length）{
$（'
）.append（group.appendTo（$（'.popover content'））；
}
});

结果是：

我所期望的是：

 <div class="popover-content">
    <div class="listCol">
    <ul>
        <li>Cate1</li>
        <li>Cate2</li>
        ................
    </ul>
  </div>    
  <div class="listCol">
    <ul>
        <li>cate11</li>
        <li>cate12</li>
        ................
    </ul>
  </div>
</div>

类别1
类别2
................


类别11
类别12
................

---

你知道是什么原因造成的吗。谢谢。

Saurabh是正确的，

不是有效的选择器

尝试将该位替换为：

$（“”）.append（“
”）

var$listCol=$（''）.appendTo（'.popover-content'）；
$（“
”）.append（组）.appendTo（$listCol）；

---

您的代码工作情况如何不是有效的选择器。你能提供一把小提琴吗？这是小提琴，但他的问题仍然存在，因为

是在
之后添加的，它应该在
@Saurabh内。你说得对，我没有注意到。现在已修复。我有一个问题，默认列表是保留在每个新列表中。甚至不清楚我在另一个li上悬停。@Domo你能重新表述一下吗？我的意思是，当我在第二个、第三个、第四个li上悬停时……
ul
，
，
。
第一个的
ul
仍然附加在后面。
var $listCol = $('<div class="listCol">').appendTo('.popover-content');
$('<ul>').append(group).appendTo($listCol);