如何使用jquery用div包围div

Question

我有一对元素， 他们是

 <h3></h3><ul></ul>
 <h3></h3><ul></ul>
 <h3></h3><ul></ul>

我想在所有这对

周围用jquery包装一个元素（div）

结果应该是

<div> <h3></h3><ul></ul> </div>
<div> <h3></h3><ul></ul> </div>
<div> <h3></h3><ul></ul> </div>

如何使用jquery.wrap()实现目标？

Answer 1

您可以遍历h3元素，并使用jquery .next()选择ul元素和.andSelf()来包含和h3元素，最后{{ 3}}围绕div：

＆＃13;

＆＃13;

$('h3').each(function() {
  $(this).next('ul').andSelf().wrapAll('<div/>');
});

＆＃13;

div {
  border: solid 1px red;
}
h3 {
  border: solid 1px green;
}
ul {
  border: solid 1px yellow;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h3>h3</h3>
<ul>ul</ul>
<h3>h3</h3>
<ul>ul</ul>
<h3>h3</h3>
<ul>ul</ul>

＆＃13;

＆＃13;

＆＃13;