包装成对的元素？

Question

如果您有以下代码：

<div class="parent">

    <div class="1a"></div>
    <div class="1b"></div>

    <div class="2a"></div>
    <div class="2b"></div>

    <div class="3a"></div>
    <div class="3b"></div>


</div>

有没有一种有效/简单的方法来包装每个a+b的新div，这样它看起来就像这样：

<div class="parent">

   <div class="new-1">        
       <div class="1a"></div>
       <div class="1b"></div>
   </div>

   <div class="new-2">        
       <div class="2a"></div>
       <div class="2b"></div>
   </div>

   <div class="new-3">        
       <div class="3a"></div>
       <div class="3b"></div>
   </div>


</div>

例如，我可以说这样的话：

用<div class="new-(incremental variable)"></div>在.parent中包装每两个div(新的包装div需要有一个唯一的类)

Answer 1

你可以从字面上使用jQueries包装函数。看看这里！

http://api.jquery.com/wrap/

Answer 2

我不确定您希望使用新的包装器div实现什么，但是CSS中的第n-child可能会很有用。尝试如下所示：

div.parent div {width:50%;}
div.parent div:nth-child(odd) {clear:both; float:left;}
div.parent div:nth-child(even) {float:right;}

...which将为您提供多对并排的div。