Обтекание с помощью jQuery

Question

Мне нужно получить некоторые элементы списка внутри div/span обертки. Вот как сейчас:

<ul> 
<li>One</li> 
<li>Two</li> 
<li>Three</li> 
<li>Four</li> 
<li>Five</li> 
<li>Six</li> 
</ul> 

Что мне нужно что-то вроде этого:

<ul> 
<div class="wrapper"> 
<li>One</li> 
<li>Two</li> 
</div><div class="wrapper"> 
<li>Three</li> 
<li>Four</li> 
</div><div class="wrapper"> 
<li>Five</li> 
<li>Six</li> 
<div class="wrapper"> 
</ul> 

Или это может быть Somthing как пролете. Не имеет значения. BUt Мне нужно обернуть после каждых трех элементов li.

Answer 1

Это не является допустимой HTML и неправильно это делать - Вы не можете вставить Div внутри списка, но я дам для дальнейшего использования синтаксиса обертки в JQuery:

$("JQUERYSELECTOR").wrap("<div class='wrapper'></div>"); 

JQUERYSELECTOR должно быть все элементы, которые вы хотите обернуть, т.е.

#ul:nth-child(1) 

для первого ребенка в списке.

Но опять же, обертывание div на элементах списка неверно.

Answer 2

Вы можете перебирать свои элементы и завернуть их с помощью .slice() и .wrapAll(), как это:

var lis = $("ul li"); 
for(var i = 0; i < lis.length; i+=3) { 
    lis.slice(i, i+3).wrapAll('<li class="wrapper"><ul></ul></li>'); 
} 

Так как вы сказали что-то как<div>/<span> это будет делать эту работу, и дать вам действительный HTML , как это:

<ul> 
    <li class="wrapper"> 
    <ul> 
     <li>One</li> 
     <li>Two</li> 
     <li>Three</li> 
    </ul> 
    </li> 
    <li class="wrapper"> 
    <ul> 
     <li>Four</li> 
     <li>Five</li> 
     <li>Six</li> 
    </ul> 
    </li> 
</ul> 

Ваш пример показывает каждые 2 элемента, но ваш текст вопроса сказал, что каждый 3 ... Я просто выбрал 3 здесь, только регулировки оборотов t число в функции, и вы все настроены.