Javascript 如何在新div中追加li

我有如下HTML标记：

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
    <li>Item 8</li>
</ul>

$('ul > li:nth-child(2n-1)').each(function() {
    $(this).next().add(this).wrapAll('<div class="main"><ul></ul></div>');
}).eq(0).closest('div').unwrap();

项目1
项目2
项目3
项目4
项目5
项目6
项目7
项目8

如何将上述HTML转换为以下格式：

<div class="main"><ul><li>Item 1</li><li>Item 2</li></ul></div>

<div class="main"><ul><li>Item 3</li><li>Item 4</li></ul></div>

<div class="main"><ul><li>Item 5</li><li>Item 6</li></ul></div>

<div class="main"><ul><li>Item 7</li><li>Item 8</li></ul></div>

第1项
第2项

第3项
第4项

第5项
第6项

第7项
第8项

您可以这样做：

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
    <li>Item 8</li>
</ul>

$('ul > li:nth-child(2n-1)').each(function() {
    $(this).next().add(this).wrapAll('<div class="main"><ul></ul></div>');
}).eq(0).closest('div').unwrap();

$（'ul>li:n第n个子（2n-1）'）。每个（函数（）{
$（this）.next（）.add（this）.wrapAll（“
”）；
}).eq（0）.最近（'div'）。展开（）；

---

首先，您尝试了什么，然后我们将知道您是否正在寻找vanilla js、jquery、mootools等