нужно обернуть h3 и div в оболочке div с помощью jquery

Question

У меня есть следующий HTML:

<div class="accordion">
  <h3>My title</h3>
  <div>My content</div>
  <h3>My title</h3>
  <div>My content</div>
  <h3>My title</h3>
  <div>My content</div>
</div>

Что мне нужно сделать через jQuery - это обернуть каждый из h3 и div в другой div class = "myDiv", так что конечный результат будет выглядеть так:

<div class="accordion">
  <div class="myDiv">
    <h3>My title</h3>
    <div>My content</div>
  </div>
  <div class="myDiv">
    <h3>My title</h3>
    <div>My content</div>
  </div>
  <div class="myDiv">
    <h3>My title</h3>
    <div>My content</div>
  </div>
</div>

Как бы я это сделал с помощью jquery?

Answer 1

Попробуйте это:

$("h3").each(function(){
   $(this).next("div").andSelf().wrapAll("<div class='myDiv'></div>");
});

http://jsfiddle.net/BSQpf/

Answer 2

Примерно так должно быть:

$('.accordion h3').each(function() {
    $(this).nextUntil('h3').andSelf().wrapAll('<div class="myDiv"/>');
});

Пример jsFiddle

См. API:

• nextUntil
• andSelf
• wrapAll