wrap more than one nodes with div

Question

How can i wrap exactly half of the div's with another div using jquery or javascript

I have this

<div class="post">1</div>
<div class="post">2</div>
<div class="post">3</div>
<div class="post">4</div>
<div class="post">5</div>
<div class="post">6</div>

I want this

<div class="wrap">
  <div class="post">1</div>
  <div class="post">2</div>
  <div class="post">3</div>
</div>    
<div class="wrap">
  <div class="post">4</div>
  <div class="post">5</div>
  <div class="post">6</div>
</div>

Answer 1

Try using this:

var posts = $('.post'),
    postCount = posts.length,
    postHalf = Math.round(postCount/2),
    wrapHTML = '<div class="wrap"></div>';

posts.slice(0, postHalf).wrapAll(wrapHTML); // .slice(0, 3)
posts.slice(postHalf, postCount).wrapAll(wrapHTML); // .slice(3, 6) 

This selects all .post , gets the number of elements found then halves that value to get the splitting point. It then uses .slice() to select a specific range of elements and .wrapAll() to wrap each selection in <div class="wrap"></div> .

Here it is working: http://jsfiddle.net/ekzrb/