用HTML (jQuery)包装代码

Question

我想向小部件区域添加一些html，基本上是为了包装内部内容。以下是当前代码：

<aside id="meta-2" class="widget widget_meta"><h1 class="widget-title">Stuff</h1>
  <ul>
    <li><a href="#">Log in</a></li>
    <li><a href="#">Entries <abbr title="Really Simple Syndication">RSS</abbr></a></li>
    <li><a href="#">Comments <abbr title="Really Simple Syndication">RSS</abbr></a></li>
  </ul>
</aside>

我想让它变成：

<aside id="meta-2" class="widget widget_meta"><h1 class="widget-title">Stuff</h1>
 <div class="widget-inner">
  <ul>
    <li><a href="#">Log in</a></li>
    <li><a href="#">Entries <abbr title="Really Simple Syndication">RSS</abbr></a></li>
    <li><a href="#">Comments <abbr title="Really Simple Syndication">RSS</abbr></a></li>
  </ul>
 </div>
</aside>

请注意，有些“小部件”不包含UL，可能只是一个图像或一些文本。

我曾尝试过一些jQuery片段使用以前，附加等，但没有任何效果。

任何帮助都将不胜感激。

Answer 1

您可以使用.wrap()

$( "aside ul" ).wrap( "<div class='widget-inner'></div>" );

工作演示

更新:用于非均匀DOM的：

$( "aside h1" ).nextAll().wrap( "<div class='widget-inner'></div>" );

工作演示

Answer 2

使用.wrap()函数参见链接：wrap() jquery

Answer 3

以上答覆如下：

$( "aside h1" ).nextAll().wrap( "<div class='widget-inner'></div>" );

谢谢