如何在jQuery中用另一个元素包装现有元素？

Question

如何创建<div>现有的周围环境<div>.

我的代码如下:

<div id="test">
  <h2>Greetings</h2>
  <p>Test</p>
  <div class="inner">Hello</div>
  <p>Test</p>
  <div class="inner">Goodbye</div>
</div>
<div id="test2">
  <h2>Greetings</h2>
  <p>Test</p>
  <div class="inner">Hello</div>
  <p>Test</p>
  <div class="inner">Goodbye</div>
</div>

<script>
  $("#test").before('<div class="test3">');
  $("#test2").after('</div>');
</script>

但它似乎无法插入<div>没有结束标记.那么如何实现呢？

Answer 1

使用.wrapAll() ^doc方法

$('#test, #test2').wrapAll('<div class="test3">');

Answer 2

您可以使用.wrap() API调用,它将使用新元素包装现有HTML.