jQuery將div包裝器添加到指定的元素

Question

我有一個CMS生成的HTML塊。我想添加一些DIV包裝到一組特定的元素。

<ul id="gform_fields_1"> 
    <li id="field_1_8" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_9" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_10" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_11" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_12" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_13" class="gfield"> 
     <!-- content --> 
    </li> 
    <li id="field_1_14" class="gfield"> 
     <!-- content --> 
    </li> 
</ul> 

我想實現以下模式：

<ul id="gform_fields_1"> 
    <div class="wrap"> 
     <li id="field_1_8" class="gfield"> 
      <!-- content --> 
     </li> 
     <li id="field_1_9" class="gfield"> 
      <!-- content --> 
     </li> 
     <li id="field_1_10" class="gfield"> 
      <!-- content --> 
     </li> 
    </div> 
    <div class="wrap"> 
     <li id="field_1_11" class="gfield"> 
      <!-- content --> 
     </li> 
    </div> 
    <div class="wrap"> 
     <li id="field_1_12" class="gfield"> 
      <!-- content --> 
     </li> 
     <li id="field_1_13" class="gfield"> 
      <!-- content --> 
     </li> 
    </div> 
</ul> 

所述包裝紙是用於元件的具體基團，例如我需要＃field_1_8，＃field_1_19和＃field_1_10被封閉在一個DIV中，然後＃field_1_11包裹在一個DIV中，然後是其餘部分。要點是，我想指定ID，而不是基於任何邏輯，可以這麼說。

.wrap()似乎是要走的路，工作是這樣的：

$('LIST ALL IDs').wrap('<div class="new" />'); 

任何提示大加讚賞。

感謝

Answer 1

因爲jQuery的選擇語法非常像CSS，你可以簡單地列出你的元素，像這樣：

$('li#field_1_8, li#field_1_9, li#field_1_10').wrapAll('<div class="new" />') 

Answer 2

可以使用slice

$('li').slice(0, 3).wrapAll("<div class='wrap'></div>") 
$('li').slice(3,4).wrap("<div class='wrap'></div>") 
$('li').slice(4,7).wrapAll("<div class='wrap'></div>") 

的jsfiddle：http://jsfiddle.net/NpxxR/