Javascript 如何用div包装匹配的html集

我有一个标题。。。h3 后面是一堆p标签。。。然后是另一个h3标签。注意最后一个的底部没有另一个h3。。。所以答案需要考虑到这一点

我想在一个div中的h3之后和下一个h3之前包装整个部分

即：

你好，世界
一些内容

更多内容

项目

你好
不再

会变成

    <h3>Hello World</h3>
    <div class="expander">
    <p>some content</p>
    <p>more content</p>
    <ul><li>item</li></ul>
    </div>

    <h3>hello again</h3>
    <div class="expander"><p>no more</p></div>

你好，世界
一些内容

更多内容

项目

你好
不再

试试看

var h3=$（'h3'）；
var=”；
h3.过滤器（':first'）.nextUntil（'h3'）.wrapAll（包装器）；
h3.过滤器（':last'）.next（'p'）.wrap（包装器）；

---

您可以找到

p

元素，该元素位于

h3

元素之后，然后将其后面的所有

p

元素按如下方式分组

$('h3 + p').each(function(){
    $(this).nextUntil(':not(p)').addBack().wrapAll('<div class="expander"></div>');
})

$（'h3+p'）。每个（函数（）{
$（this）.nextUntil（':not（p）'）.addBack（）.wrapAll（''）；
})

---

演示：

使用包装带h3中的所有元素

 $("h3").filter(function(){   // to select all h3 element
$(this).nextUntil("h3").wrapAll('<div class="expander">');// select one h3 element to other h3 element and wrap the all element 
});

$（“h3”）.filter（函数（）{//选择所有h3元素
$（this）.nextUntil（“h3”）.wrapAll（“”）；//选择一个h3元素到另一个h3元素，并包装all元素
});

您可以像下面一样使用Jquery的$.each（）在每个h3之后放置一个包装器

         var h3 = $("h3");
         var wrapper = $("<div id='wrapper'>");

         $.each(h3,function(){

           $(this).nextUntil("h3").wrapAll(wrapper);
         });

var h3=$（“h3”）；
变量包装器=$（“”）；
$。每个（h3，函数（）{
$（this.nextUntil（“h3”）.wrapAll（wrapper）；
});

---

这不太管用。。。在内容后面再添加几组h3，它只适用于第一组和最后一组。我需要它来做所有的h3设置

 $("h3").filter(function(){   // to select all h3 element
$(this).nextUntil("h3").wrapAll('<div class="expander">');// select one h3 element to other h3 element and wrap the all element 
});

         var h3 = $("h3");
         var wrapper = $("<div id='wrapper'>");

         $.each(h3,function(){

           $(this).nextUntil("h3").wrapAll(wrapper);
         });