jquery group every 3rd div

Question

У меня есть следующая структура, один внешний div (#results) и около 20 divs с событием класса. Я хочу, чтобы сгруппировать каждые 3 события и обернуть DIV называемый внешний вокруг них,

<div id="result"> 

    <div class="event"> 
     <div class="date">8 April</div> 
      <div class="eventname">my title</div> 
      <div class="link">my link goes here</div> 
    </div> 

// lots more events here 
</div> 

Answer 1

Try:

while ($('#result > .event').length > 0) { 
    $('#result > .event:lt(3)').wrapAll('<div class="wrap"></div>') 
}​​​​ 

http://jsfiddle.net/rxxjp/

Answer 2

Вот один подход: http://jsfiddle.net/vM9KM/4/

$('#result').children('div.event:nth-child(3n+1)').each(function(i,el) { 
    $(this).next().andSelf().next().andSelf().wrapAll('<div class="outer">'); 
});​ 

http://api.jquery.com/nth-child-selector/

Answer 3

Я использовал splice и wrapAll функции группы 3 Дивых х и завернуть их в <div class="wrapper" ></div>

DEMO

var events = $('#result .event'); 

while (events.length >= 3) { 
    $(events.splice(0, 3)).wrapAll('<div class="wrapper" />'); 
} 

//wrap the remaining < than 3 div inside wrapper 
$(events.splice(0, events.length)).wrapAll('<div class="wrapper" />');