jquery - 如何使用 jquery 将整个部分添加到一堆 html 元素中？

Question

我想在 div id="primary" 的内容中添加一段 class="box"，不包括 h1。我的html如下。

<div id="primary">

    <h1 class="page-title">Search Results for: dffd</h1>        

        <h2>Nothing Found</h2>
        <p>Sorry, but nothing matched your search criteria. Please try again with some different keywords.</p>


 </div> <!--end #primary -->

所以我想要实现的是

<div id="primary">

  <h1 class="page-title">Search Results for: dffd</h1>  

 <section class="box">



        <h2>Nothing Found</h2>
        <p>Sorry, but nothing matched your search criteria. Please try again with some different keywords.</p>

   </section>

 </div> <!--end #primary -->

编辑：犯了一个错误，我不希望我的 h1 在该部分中，已修改问题

Answer 1

使用jQuery 的 wrapInner：

$('#primary').wrapInner('<section class="box" />');

--编辑--

看到你修改过的问题，试试这个：

// Wrap the contents in with the section
$('#primary').wrapInner('<section class="box" />');

// Detach (remove, but retain events/data) the <h1>, then prepend it to the primary div
$('#primay .box h1').detach().prependTo('#primary');

当然，有很多方法可以做到这一点。

干杯

Answer 2

$('#primary').children().not('h1').wrapAll('<section class="box"></section>');