Comment insérer un bloc de html après un bloc que je viens de rendre sur le DOM

Question

Je construis un bloc de divs imbriquées autour d'un élément spécifique sur le client. J'utilise initialement .wrap() de jQuery pour obtenir la première partie du bloc qui fonctionne bien. Mais maintenant je veux attacher le bloc de fin après l'élément que j'emballe et je trouve que je ne peux pas l'attacher à quelque chose parce que tout est créé en même temps. J'ai essayé d'utiliser insertAfter() mais je ne veux pas que ce soit un frère de l'élément que j'emballe, je veux qu'il vienne après son parent.

Voici mon code:

$(document).ready(function() { 
buildShadows('#section'); 
}); 


function buildShadows(element){ 
     $(element).wrap("<div class='section_shadow_wrapper'><div class='section_shadow_curve'><div class='section_shadow_outer'><div class='section_shadow_inner_left'><div class='section_shadow_inner_right'>"); 
     $("<div class='section_shadow_bottom_left'><div class='section_test_bottom_right'>").insertAfter(element); 

} 

Ce que je suis en train de faire est de joindre le premier élément de la deuxième partie (section_shadow_bottom_left) en tant que frères et soeurs de « section_shadow_inner_right » mais après « élément »

Toute aide serait appréciée. Merci.

Answer 1

Vous devriez pouvoir traverser jusqu'au nouveau parent que vous venez de créer.

Avez-vous essayé?

function buildShadows(element){ 
    $(element).wrap('<div class="section_shadow_wrapper clearfix"><div class="section_shadow_curve"><div class="section_shadow_outer"><div class="section_shadow_inner_left"><div class="section_shadow_inner_right">') 

     .parent().after('<div class="section_shadow_bottom_left"><div class="section_test_bottom_right">'); 

} 

Answer 2

Essayez traverser à l'autre frère de l'élément original et en utilisant .insertBefore() dessus.

var nextsibling = $(element).next(); 
//Wrap code 
$("<div class='section_shadow_bottom_left'><div class='section_test_bottom_right'>").insertBefore(nextsibling);