如何用新类包装元素并删除内包装？

Question

例如：

<div class="container">
  <div class="inner"><p>Hello</p></div>
  <div class="inner"><p>Goodbye</p></div>
</div>

输出应该是这样的：

<div class="container">
  <div class="new">
    <p>Hello</p>
    <p>Goodbye</p>
  </div>
</div>

Answer 1

您可以使用.unwrap()和.wrapAll()方法：

$('.container p').unwrap().wrapAll('<div class="new"></div>');

jsFiddle

Answer 2

您可以使用wrapAll包装所有内部包装器并使用unwrap使用contents删除内部包装器，如下所示：

像这样使用：demo

$('.inner').wrapAll('<div class="new" />').contents().unwrap();

或者像这样使用：demo

$('.inner p').unwrap().wrapAll('<div class="new" />');