title: jquery wrap every four child elements of a list element individually
body: <p>I'm having trouble to group elements inside a list element.</p>
  
  <p>For excample I have three list elements:</p>
  
  <pre><code>&lt;ul class="row"&gt;
  &lt;li class="item"&gt; 
  &lt;!-- product name --&gt;
  &lt;div class="imglist"&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;ul class="row"&gt;
    &lt;li class="item"&gt; 
      &lt;!-- product name --&gt;
      &lt;div class="imglist"&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;ul class="row"&gt;
  &lt;li class="item"&gt; 
  &lt;!-- product name --&gt;
  &lt;div class="imglist"&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>In Jquery I tried this:</p>
  
  <pre><code>var divs = $("div.imglist &gt; a");
  for(var i = 0; i &lt; divs.length; i+=4) {
  divs.slice(i, i+4).wrapAll("&lt;div class='group'&gt;&lt;/div&gt;");
  }
  </code></pre>
  
  <p>but now the result is that:</p>
  
  <pre><code>&lt;ul class="row"&gt;
  &lt;li class="item"&gt; 
  &lt;!-- product name --&gt;
  &lt;div class="imglist"&gt; 
  &lt;div class="group"&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;&lt;/div&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  
  &lt;li class="item"&gt; 
  &lt;!-- product name --&gt;
  &lt;div class="imglist"&gt;
  &lt;div class="group"&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;&lt;/div&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  
  &lt;li class="item"&gt; 
  &lt;!-- product name --&gt;
  &lt;div class="imglist"&gt;   
  &lt;div class="group"&gt;
  &lt;a href="#" title="image"&gt;&lt;span class="txt"&gt;txt&lt;/span&gt;&lt;/a&gt;&lt;/div&gt; 
  &lt;/div&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>My problem is that I want the wrapping for each <code>li.item</code> individually.</p>