Я хочу добавить 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 раньше, добавлять и т. Д., Но безрезультатно.

Любая помощь будет очень признательна.

1
Huw Rowlands 10 Сен 2014 в 12:35

3 ответа

Лучший ответ

Вы можете использовать .wrap () :

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

Рабочая демонстрация

Обновление: для неоднородной модели DOM:

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

Рабочая демонстрация

4
Milind Anantwar 10 Сен 2014 в 09:28

Используйте функцию .wrap() см. ссылку: wrap () jquery

0
G.Nader 10 Сен 2014 в 08:38

Ответ сверху был:

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

Благодарность

0
Huw Rowlands 10 Сен 2014 в 09:40