Wrap alle Elemente mit einem div nach einem bestimmten Element mit jQuery

Question

Ich versuche, alle Divs, die nach einem bestimmten Element kommen zu wickeln. Wie kann ich dies mit jQuery tun?

aktuelle Code

<div class="a"></div> 
<div class="b"></div> 
<div class="b"></div> 

<div class="a"></div> 
<div class="b"></div> 
<div class="b"></div> 

<div class="a"></div> 
<div class="b"></div> 
<div class="b"></div> 

gewünschte Ausgabe

<div class="a"></div> 
<div class="wrapper"> 
    <div class="b"></div> 
    <div class="b"></div> 
</div> 

<div class="a"></div> 
<div class="wrapper"> 
    <div class="b"></div> 
    <div class="b"></div> 
</div> 

<div class="a"></div> 
<div class="wrapper"> 
    <div class="b"></div> 
    <div class="b"></div> 
</div> 

Answer 1

Sie wickeln Element für jeden .a schaffen könnten, fügen Sie alle Elemente bis zum nächsten .a Elemente und dann auf DOM hinzufügen.

$('.a').each(function() { 
 
    var wrap = $('<div class="wrapper"></div>'); 
 
    $(this).nextUntil('.a').appendTo(wrap); 
 
    $(this).after(wrap); 
 
})

.wrapper { 
 
    border: 1px solid black; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div> 
 

 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div> 
 

 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div>

Answer 2

Wenn es immer 2 .b, könnten Sie den folgenden Code verwenden:

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

.wrapper { 
 
    border: 1px solid black; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div> 
 

 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div> 
 

 
<div class="a">A</div> 
 
<div class="b">B</div> 
 
<div class="b">B</div>