Javascript 如何在不复制包装器div的情况下包装表行'；s

我有以下由Wordpress生成的代码：

<h3>
<span class="title">General Settings:</span>
</h3>
<table class="form-table">
<tbody>
<div class="section_box1"><tr class="section1" valign="top">
<th scope="row">Hide Menu Background:</th>
<td>
<input id="" checked="" name="" type="checkbox">
</td>
</tr><tr class="section1" valign="top">
<th scope="row">
Menu Background:
</th>
<td>
<input name="" type="file">
</td>
</tr></div>
<div class="section_box2"><tr class="section2" valign="top">
<th scope="row">Hide Sidebar:</th>
<td>
<input id="" checked="" name="" type="checkbox">
</td>
</tr><tr class="section2" valign="top">
<th scope="row">Hide Site Title:</th>
<td>
<input id="" checked="" name="" type="checkbox">
</td>
</tr></div>
</tbody>
</table>

一般设置：
隐藏菜单背景：
菜单背景：
隐藏侧边栏：
隐藏站点标题：

目前将有两个部分（tr.section1和tr.section2）。
现在我将用两个div（.section_box1和.section_box2）来包装这些部分

因此我使用以下Jquery：

//Lets wrap those two sections inside divs ...
$('tr.section1').not($('tr').eq(1)).each(function(){
$(this).add($(this).nextUntil('.section2')).wrapAll('<div class="section_box1"></div>');
});

    $('tr.section2').not($('tr').eq(3)).each(function(){
    $(this).add($(this).nextUntil('.section3')).wrapAll('<div class="section_box2"></div>');
    });

//让我们将这两个部分包装在div中。。。
$（'tr.section1'）。不是（$（'tr'）.eq（1））。每个（函数（）{
$（this）.add（$（this）.nextUntil（'.section2'））.wrapAll（''）；
});
$（'tr.section2'）。不是（$（'tr'）.eq（3））。每个（函数（）{
$（this）.add（$（this）.nextUntil（'.section3'））.wrapAll（''）；
});

现在这段代码的问题是：如果我在我的分区中添加另一个设置字段（例如复选框），我的包装器div（section_-box1§ion_-box2）将重复（显然我希望避免重复）。

我创建的是为了向您展示我的问题。

那么，如何在不复制包装器div的情况下正确包装我的分区，并且仍然能够在包装器div的section\u box1和section\u box2中添加更多字段呢
我已经试着做了几个小时了，但运气不好：（

---

提前谢谢大家！！

您的jQuery非常复杂，简直不可思议

如果您真的只想将所有

.section1

tr

封装在一个

.section\u box1

div

（第2节也是如此）中，可以使用以下方法进行包装：

//Lets wrap those two sections inside divs ...
$('tr.section1').wrapAll('<div class="section_box1"></div>');
$('tr.section2').wrapAll('<div class="section_box2"></div>');

//让我们将这两个部分包装在div中。。。
$（'tr.section1'）.wrapAll（''）；
$（'tr.section2'）.wrapAll（''）；

---

请参见此处的更新小提琴：

感谢您制作了一把漂亮的小提琴。但是关于你的问题，你为什么要用divs来包装

tr

s？我认为这甚至不是有效的HTML。你的目标是什么？我想做手风琴一样的设置。。。但是我不知道怎么做。谢谢你！！现在，我可以通过将它包装在另一个tr:=）中使其有效，你真的帮了我很多！！