jQuery 包裹列表元素

Question

我的标记就像 ul 中的一些 li。就像这样。

<ul id="menu">
<li class="test"><a href="#">dhsd</a></li>
<li class="test"><a href="#">sdghds</a></li>
- - - - - - - - - - - - -- - - - -
- - - -- - - - - - -- -- - - - -- -
<li class="lang-switch language_en"><a href="#">en</a></li>
<li class="lang-switch language_es"><a href="#">es</a></li>
<li class="lang-switch language_de"><a href="#">de</a></li>
<li class="lang-switch language_ja"><a href="#">ja</a></li>
</ul>

从这里你可以看到，在一些 li 之后，最后四个有类名 lang-switch。 我想包装那些类为 lang-switch 的 li 标记。所以我的标记应该是这样的

<ul id="menu">
<li class="test"><a href="#">dhsd</a></li>
<li class="test"><a href="#">sdghds</a></li>
- - - - - - - - - - - - -- - - - -
- - - -- - - - - - -- -- - - - -- -
<ul class="listing">
  <li class="lang-switch language_en"><a href="#">en</a></li>
  <li class="lang-switch language_es"><a href="#">es</a></li>
  <li class="lang-switch language_de"><a href="#">de</a></li>
  <li class="lang-switch language_ja"><a href="#">ja</a></li>
</ul>
</ul>

所以为了添加一个换行，我做了一个像这样的jquery

 jQuery(document).ready(function() {
    var LangList = jQuery('ul#menu').find('li.lang-switch');
    jQuery(LangList).wrap('<ul class="test"></ul>');
  });

但是这个正在做这样的包装

<ul class="test">
  <li class="lang-switch language_en"><a href="#">en</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_es"><a href="#">es</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_de"><a href="#">de</a></li>
 </ul>
  <ul class="test">
  <li class="lang-switch language_ja"><a href="#">ja</a></li>
 </ul>

有人可以告诉我如何对这些具有相同类别的列表进行包装吗？

Answer 1

使用.wrapAll()

var LangList = jQuery('ul#menu').find('li.lang-switch');
LangList.wrapAll('<ul class="test"></ul>');

Working JSFiddle

正如 Rajaprabhu Aravindasamy 指出的那样，您不需要再次将 LangList 转换为 jQuery 对象，因为它已经是一个 jQuery 对象了。