javascript - jQuery把一系列div标签做成一个无序列表

Question

我有一系列的div标签如下:

<div>
    <div class="MB_SLOT" id="slot1"></div>
    <div class="MB_SLOT" id="slot2"></div>
    <div class="MB_SLOT" id="slot3"></div>
    <div class="MB_SLOT" id="slot4"></div>
</div>

我想把 MB_SLOT元素放入无序列表 ( ul )，但所有内容(包括包含的 div)都是由我无法控制的 API 生成的，生成的元素数量可能因页面而异。

如果我使用 j$( ".MB_SLOT" ).wrap( "<li></li>" );我可以包装每个 MB_SLOT元素，但我不知道如何将其包装在 <ul></ul> 中

谁能建议实现这一目标的最佳方法？

Answer 1

给你的 li 一个更具体的类

$( ".MB_SLOT" ).wrap( "<li class='list-item'></li>" );

然后使用 .wrapAll() 包装“list-item”的所有实例

$( ".list-item" ).wrapAll( "<ul></ul>" );

Working fiddle