jQuery在div中包裝元素集

Question

您好我想使用jQuery來包裝div中的元素集

HTML：

<h3>Title</h3>
<ul>
<li>Feature</li>
<li>Feature</li>
</ul>

<h3>Title</h3>
<ul>
<li>Feature</li>
<li>Feature</li>
</ul>

<h3>Title</h3>
<ul>
<li>Feature</li>
<li>Feature</li>
</ul>

期望的結果：

<div class="box">
    <h3>Title</h3>
   <ul>
    <li>Feature</li>
    <li>Feature</li>
    </ul>
    </div>

<div class="box">
    <h3>Title</h3>
   <ul>
    <li>Feature</li>
    <li>Feature</li>
    </ul>
    </div>

<div class="box">
    <h3>Title</h3>
   <ul>
    <li>Feature</li>
    <li>Feature</li>
    </ul>
    </div>

我的問題類似於以下內容，但我無法得到Russ Cam建議的解決方案。

使用jQuery將三個重復的div組包裝成一個

提前致謝。

Answer 1

試試這個：

$(document).ready(function(){
 $('h3').each(function(){
  $(this).add( $(this).next() ).wrapAll('<div class="box"></div>');
 })
})