Ho il seguente codice HTMLavvolgere tutti gli elementi tra due elementi
<div class="bar-something"><div class="fn-label"> SOMETHING</div> </div>
<div class="bar-appointment"><div class="fn-label"> Ap1</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap2</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap3</div></div>
<div class="bar-something-else"><div class="fn-label"> SOMETHING</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap1</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap2</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap3</div></div>
<div class="bar-something-odd"><div class="fn-label"> SOMETHING</div></div>
voglio avvolgere tutti gli elementi con un altro bar-appointment
DIV
in modo che il DOM
sarebbe quindi simile:
<div class="bar-something"><div class="fn-label"> SOMETHING</div> </div>
<div class="test">
<div class="bar-appointment"><div class="fn-label"> Ap1</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap2</div></div>
<div>
<div class="bar-something-else"><div class="fn-label"> SOMETHING</div></div>
<div class="test">
<div class="bar-appointment"><div class="fn-label"> Ap1</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap2</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap3</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap4</div></div>
<div class="bar-appointment"><div class="fn-label"> Ap5</div></div>
</div>
<div class="bar-something-odd"><div class="fn-label"> SOMETHING</div></div>
I Ho provato quanto segue, ma anche tutti i tag interni vengono avvolti e non voglio.
$('.bar-appointment').each(function() {
$(this).nextUntil("div[class!='bar-appointment']").andSelf().wrapAll('<div class="test"></div>')});
Ho anche provato utilizzando solo wrap
e questo avvolge solo ogni elemento singolarmente, non come un gruppo come vorrei.
Qual è il modo migliore di farlo?
http://jsfiddle.net/arunpjohny/mxf85eu6/ –