jQuery:选择不带标签的文本，然后用标签包裹

Question

代码如下:

<div class="categories-list">
Description One
<ul>
    <li>
        <span>CATEGORY1</span>
        <span>CATEGORY2</span>
        <span>CATEGORY3</span>
    </li>
</ul>
</div>

我想做的是选择文本"Description one"，它周围没有标签，并使用jQuery用标签(特别是h2)包装它，所以最终的代码看起来像:

<div class="categories-list">
<h2>Description One</h2>
<ul>
    <li>
        <span>CATEGORY1</span>
        <span>CATEGORY2</span>
        <span>CATEGORY3</span>
    </li>
</ul>
</div>

我知道我可以使用wrap()函数完成第二件事。

Answer 1

简单的wrap不能完成这项工作，除非你走过元素的contents:

$(".categories-list").contents().first().wrap("<h2 />");

演示:

http://jsfiddle.net/MDhvY/