How can I insert div.one
into his next div.two
with jquery?
What it is:
JavaScript
x
9
1
<div id="list">
2
<div class="box one"></div>
3
<div class="box two"></div>
4
<div class="box one"></div>
5
<div class="box two"></div>
6
<div class="box one"></div>
7
<div class="box two"></div>
8
</div>
9
What I want:
JavaScript
1
12
12
1
<div id="list">
2
<div class="box two">
3
<div class="box one"></div>
4
</div>
5
<div class="box two">
6
<div class="box one"></div>
7
</div>
8
<div class="box two">
9
<div class="box one"></div>
10
</div>
11
</div>
12
What I tried (but it insert all div.one
in every div.two
):
JavaScript
1
4
1
$("#list .box.one").each(function() {
2
$(this).prependTo(".box.two").next();
3
});
4
Whats my fail?
Advertisement
Answer
You were close:
JavaScript
1
4
1
$("#list .box.one").each(function() {
2
$(this).prependTo($(this).next());
3
});
4
using the class in the preprendTo()
function will of course select all the .box.two
elements, instead by doing $(this).next()
we only get the very next sibling element.