jQuery move Elemento DOM all'interno del genitore

Question

C'è un modo semplice per spostare un elemento all'interno del proprio genitore?

... Ti piace questa

da:

<div class="test">hello 1</div> 
<div class="test">hello 2</div> 
<div class="test">hello 3</div> 

a:

<div class="test">hello 1</div> 
<div class="test">hello 3</div> 
<div class="test">hello 2</div> 

O spostare un UP o DOWN div un passo, o utilizzando l'indice per appendTo in una specifica posizione.

Answer 1

Si dovrebbe essere in grado di utilizzare .prev() e .next() come questo (qui in funzione jQuery):

$.fn.moveUp = function() { 
    $.each(this, function() { 
     $(this).after($(this).prev()); 
    }); 
}; 
$.fn.moveDown = function() { 
    $.each(this, function() { 
     $(this).before($(this).next()); 
    }); 
}; 
$("div:eq(2)").moveUp(); //Would move hello 3 up 
$("div:eq(0)").moveDown(); //Would move hello 1 down 

JSFiddle Demo

Answer 2

Prova

$("div:eq(2)").after($("div:eq(0)")); 

o

$("div:eq(2)").before($("div:eq(1)")) 

Ricordando che: eq() è zero based.

Answer 3

var child = $('#parent div'); // keep reference for further use 
child.eq(2).insertBefore(child.eq(1)); 

DEMO