Reputation: 19251
I have the following HTML like
<body>
<div class="myCool">blah</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="myCool">blah</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
</body>
What am I trying to do is start at myCool
and wrap it and the next 4 classes cool
into a div
? So it looks like
<div id="1" class="myWrapped">
<div class="myCool">blah</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
</div>
<div id="2" class="myWrapped">
<div class="myCool">blah</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
<div class="cool">some text</div>
</div>
Any ideas how I can do this ?
Upvotes: 0
Views: 63
Reputation: 11
you can do like this
jQuery("<div class='myCool'>blah</div>").appendTo('body');
for(var i=0; i<4;i++)
{
jQuery('<div class="cool">some text</div>').appendTo('.myCool');
}
Upvotes: -2
Reputation: 95020
try
$(".myCool").each(function(i){
$(this).nextUntil(".myCool").andSelf().wrapAll("<div id='" + (i+1) + "' class='myWrapped'></div>");
});
Upvotes: 4