将父级添加到jquery中的一组节点

Question

所以我有以下结构:

  <h3>I.</h3>
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <p>Some text</p>

    <h3>II.</h3>
            <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>

    <p>Some text</p>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <h3>III</h3> 
    etc

我想以这种方式添加div元素:

  <h3>I.</h3>
   <div>
        <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
    <p>Some text</p>
   </div>
    <h3>II.</h3>
   <div>
            <ul>
            <li>1</li>
            <li>2</li>
            <li>3</li>
        </ul>

    <p>Some text</p>
    <ol>    
        <li>1.</li>
        <li>2.</li>
        <li>3.</li>
    </ol>
  </div>
    <h3>III</h3> 
    etc

我设法弄清楚如何将元素提升到下一个h3,但后来我被卡住了.

var elements = $("h3").nextUntil("h3");
            elements.wrapAll("<div>");

Answer 1

因为有多个h3元素需要循环遍历它们并nextUntil()在循环中使用:

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

示例小提琴