Пытаясь понять wrapall()

Question

Я прочитал о wrapall() и думаю, что это может быть решением, которое мне нужно. Дайте эту структуру:

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

Я хотел бы в конечном итоге с этой структурой:

<ul>
<div class="class1">
<li></li>
<li></li>
</div>
<div class="class2">
<li></li>
<li></li>
</div>
</ul>

Я не имею ни малейшего, как это сделать. Я прочитал несколько примеров Wrapall, но ни один из них я не могу адаптировать таким образом

Answer 1

var a = $('li');
do { $(a.slice(0,2)).wrapAll('<li class="two"><ul></ul></li>'); }
while( (a = a.slice(2) ).length>0 );

что приводит к:

<ul>
    <li class="two">
       <ul>
          <li>a1</li>
          <li>a2</li>
       </ul>
    </li>
    <li class="two">
       <ul>
         <li>b1</li>
         <li>b2</li>
       </ul>
    </li>
</ul>

Answer 2

Я бы предложил:

$('ul li').slice(0,2).wrapAll('<ul></ul>').closest('ul').wrap('<li />');

Что приводит к:

<ul>
    <li>
        <ul>
             <li>1</li>
             <li>2</li>
         </ul>
     </li>    
    <li>3</li>
    <li>4</li>
</ul>

JS Fiddle demo.