Envelopper une série d’éléments entre deux balises h2 avec jquery

J’ai actuellement une page créée dynamicment comme ci-dessous:

a Heading
 a paragraph
 a paragraph
 a paragraph
Comment déclencher par programme Fancybox avec une div en ligne?
événement de tir lorsque la session reCAPTCHA expire
Erreur: JavaScript de Bootstrap nécessite jQuery, à l’aide de Webpack
Publication de JSON avec JQuery
comment transmettre les identifiants pour un service Web utilisant l’appel jquery ajax?
 a paragraph
 a paragraph

 a Heading
 a paragraph
 a paragraph
 a paragraph
 a paragraph
 a paragraph

Ce que je cherche à faire est d’utiliser jQuery pour envelopper les balises h2 et p jusqu’à la balise h2 suivante: par exemple:

  a Heading
 a paragraph
 a paragraph
 a paragraph
 a paragraph
 a paragraph

  a Heading
 a paragraph
 a paragraph
 a paragraph
 a paragraph
 a paragraph

Jusqu’ici, j’ai réussi sans succès cela, mais je me suis rapproché en utilisant le code d’un utilisateur ici (je ne trouve pas le lien vers l’article original):

 $('.report-content h2').each(function(){ var $set = $(); var nxt = this.nextSibling; while(nxt) { if(!$(nxt).is('.report-content h2')) { $set.push(nxt); nxt = nxt.nextSibling; } else break; } $set.wrapAll(''); });

Ce que j’obtiens, c’est que la div n’est enroulée que sur les balises p mais doit inclure la balise h2 associée, généralement celle située au-dessus des balises p .

Voici. Prenez chaque h2 , saisissez toutes les sibilings jusqu’à obtenir un autre h2 (ou aucun élément à ce niveau), puis réincluez le h2 dans l’ensemble. Voici le JSFiddle.

 $('.report-content h2').each(function(){ var $set = $(this).nextUntil("h2").andSelf(); $set.wrapAll('
'); });

ou comme ScottE a souligné

 $('.report-content h2').each(function(){ $(this).nextUntil("h2").andSelf().wrapAll('
'); });

Documentation JQuery

nextUntil
et soi

 $('.report-content h2').each(function(){ var $set = $(this); // this is your key ;) var nxt = this.nextSibling; while(nxt) { if(!$(nxt).is('.report-content h2')) { $set.push(nxt); nxt = nxt.nextSibling; } else break; } $set.wrapAll('
'); });

Voir http://jsfiddle.net/mMpVB/

PS Si quelqu’un cherche la réponse à cette question pour jQuery 1.8+, addSelf() est déconseillé en faveur de addBack() .

Une modification de la réponse de @ Hexxagonal a fonctionné pour moi:

 $('.report-content h2').each(function(){ var $set = $(this).nextUntil("h2").addBack(); $set.wrapAll('
'); });

Voir:

Découvrez la fonction nextUntil () de JQuery