Andy
Andy

Reputation: 19251

jQuery Get the Next Set of Classes?

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

Answers (2)

raghu koppal
raghu koppal

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

Kevin B
Kevin B

Reputation: 95020

try

$(".myCool").each(function(i){
  $(this).nextUntil(".myCool").andSelf().wrapAll("<div id='" + (i+1) + "' class='myWrapped'></div>");
});

Upvotes: 4

Related Questions