jQuery甚至位置DOM包裝

Question

我有以下html代碼，我想要close div和包裝div內的兩個ul。

Ul會越來越多，因爲它會動態添加。

<div class="span9 well viewDetailDiv"> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
    </ul><ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 

我想輸出如下。

<div class="span9 well viewDetailDiv"> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 
<div class="span9 well viewDetailDiv"> 
    <ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
    </ul><ul class="span6 pull-left"> 
     <li></li> 
     <li></li> 
    </ul> 
</div> 

我已經試過

$('.viewDetailDiv ul:even').not(':first').css('margin-left','0').wrapAll('<div class="span9 well viewDetailDiv">'); 
$('.viewDetailDiv ul:nth-of-type(2)').nextUntil('ul').andSelf().wrapAll('<div class="span9 well viewDetailDiv">'); 

$('.viewDetailDiv ul').each(function() 
{ 
    $(this).nextUntil('ul:even').andSelf().wrapAll('<div class="span9 well viewDetailDiv" />'); 
}); 

$('.viewDetailDiv ul').each(function() 
{ 
    $(this).nextUntil('ul:even').prev().wrapAll('<div class="span9 well viewDetailDiv" />'); 
    console.log($(this).nextUntil('ul:even')); 
}); 

沒有上面的代碼解決我的問題。

所以，如果你們看到錯誤，請讓我知道，所以我可以糾正自己。

Answer 1

嘗試此，

$(document).ready(function(){    
    var uls = $("ul"); 
    for(var i = 0; i < uls.length; i+=2) { 
      uls.slice(i, i+2).wrapAll("<div class='span9 well viewDetailDiv'></div>"); 
    } 
}); 

Working fiddle

邏輯從Using JS to wrap pairs of <li> in divs