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" />')