如何使用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's 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>');