在 <h3> 标记之后添加 <div> 使用 jquery 在 </h3> 标记之前打开和关闭 </div>

Question

我想用 div 换行，有人可以帮助我如何做到这一点。我无法更改我的 html 结构，因此我需要使用 jquery。

这是我的html代码

<div>
<h3>Title 1</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br />
<br />
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

<h3>Title 1</h3>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br />
<br />
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</div>

这里是js

$('h3').each(function(){
    $(this).nextUntil('h3')
        .wrapAll('<div>').parent().add(this)
        .wrapAll('<li>').parent().appendTo(h3);
});

here is jsfiddle link

提前致谢

Answer 1

你可以这样做

$('div').contents().filter(function() {
    return this.nodeType === 3;
}).wrap('<div></div>');

这将选择所有纯文本并用 div 元素包装它

Demo Fiddle

编辑

这样就可以了，

$('div').contents().filter(function() {
    return this.nodeType === 3;
}).wrap('<div class="temp"></div>');

$("h3").each(function() {
    $(this).nextUntil("h3").wrapAll("<div class='wraper'></div>");
});

$(".temp").contents().unwrap();

Updated Fiddle