jquery sposta l'elemento in ultima posizione figlio

Question

Diciamo che ho uno <div> che contiene alcuni elementi casuali, ma c'è un elemento che ho creato con questo selettore unico: $('.myUniqueElement'). Voglio usare .insertAfter() per spostare questo elemento all'ultima posizione child nel mio <div> è possibile? Qual'è la soluzione ?

Questa è la mia soluzione: http://jsfiddle.net/silverlight/RmB5K/3/ è OK?

HTML:

<div class='p'> 
    <div class='myUniqueElement'>unique</div> 
    <div>item</div> 
    <div>item</div> 
    <div>item</div> 
</div> 
<input type='button' id='b' value='Do'/> 

Javascript:

$('#b').on('click',function(){ 
    $('.myUniqueElement').insertAfter($('.p :last-child')) 
}); 

CSS:

.myUniqueElement{color:red;} 

Answer 1

Prova

var mydiv = $('my-div-selector'); 
mydiv.find('.myUniqueElement').appendTo(mydiv) 

o semplice

$('my-div').append($('.myUniqueElement')) 

Answer 2

Per poter utilizzare insertAfter(), è necessario conoscere l'elemento dopo il quale si desidera spostare il vostro elemento a. E come hai detto tu hai elementi casuali e, naturalmente, non conosci l'ultimo elemento corrente, quindi ecco cosa puoi fare.

Clona l'elemento che desideri spostare e aggiungilo all'elemento padre.

Il codice jQuery si presenta così:

$clone_elem = $('.myUniqueElement').clone(); 
$('.myUniqueElement').remove(); 
$('div').append($clone_elem); 

Acquista questo fiddle

Answer 3

Vikas è giusto. Tuttavia, probabilmente questa è una versione migliorata di esso poiché l'elemento originale viene rimosso, non il suo clone ....

$elem = $('.myUniqueElement') 
    $('div').append($elem.clone()); 
    $elem.remove(); 

Answer 4

Questo è la mia soluzione e penso che questo sia il modo migliore per utilizzare .insertAfter():

HTML:

<div class='p'> 
    <div class='myUniqueElement'>unique</div> 
    <div>item</div> 
    <div>item</div> 
    <div>item</div> 
</div> 
<input type='button' id='b' value='Do'/> 

jquery:

$('#b').on('click',function(){ 
    $('.myUniqueElement').insertAfter($('.p :last-child')) 
}); 

Il punto è :last-child e questo è il violino: http://jsfiddle.net/silverlight/RmB5K/3/

Answer 5

Non v'è alcuna necessità di utilizzare .insertAfter. Si dovrebbe anche non utilizzare .clone poiché rimuoverà qualsiasi dato o evento associato, a meno che non si usi .clone(true).

Basta usare .appendTo per aggiungere l'elemento di destinazione al div e potrai ottenere staccato dalla sua posizione originale e ha aggiunto come ultimo figlio del div:

$('.myUniqueElement').appendTo('#my-div');