Wrap einige divs mit zwei verschiedenen Spalten

Question

Ich habe diese divs

<div class="content"> 
<div class="rpost">-115</div> 
<div class="lpost">-91</div> 
<div class="lpost">-99</div> 
<div class="rpost">-181</div> 
<div class="lpost">-19</div> 
<div class="rpost">-135</div> 
<div class="rpost">-85</div> 
<div class="lpost">-39</div> 
</div> 

Ich möchte unabhängig von der Reihenfolge der divs, wickeln lpost in einem div left_columns genannt, und RPost in einem div right_columns.

<div class="left_columns"> 
    <div class="lpost">-91</div> 
    <div class="lpost">-99</div> 
    <div class="lpost">-19</div> 
    <div class="rpost">-85</div> 
</div> 
<div class="right_columns"> 
    <div class="rpost">-115</div> 
    <div class="rpost">-181</div> 
    <div class="rpost">-135</div> 
    <div class="rpost">-85</div> 
</div> 

kann Mauerwerk oder Isotop und infinite-scroll das tun?

Answer 1

sollten Sie class verwenden, anstatt hier von id und dann können Sie wrapAll

$('.content').each(function() { 
 
    $(this).find(".lpost").wrapAll('<div class="left_columns"></div>') 
 
    $(this).find(".rpost").wrapAll('<div class="right_columns"></div>') 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="content"> 
 
    <div class="rpost">-115</div> 
 
    <div class="lpost">-91</div> 
 
    <div class="lpost">-99</div> 
 
    <div class="rpost">-181</div> 
 
    <div class="lpost">-19</div> 
 
    <div class="rpost">-135</div> 
 
    <div class="rpost">-85</div> 
 
    <div class="lpost">-39</div> 
 
</div>