How to move a div after the next div

Question

How to move a div after the next div. For example, I have 3 different divs.

<div class="div1">Div1</div>
<div class="div2">Div2</div>
<div class="div3">Div3</div>

I want to move the first div after the second div. This means that it div2will be first, and div1will be second. I have the same html format.

I want to execute jquery something like

$(".div1").each(function() {
    $(this).appendTo().$(this).after();
});

Let me know if that doesn't make sense.

Answer 1

you can get the item . next () and put it .after ()

or

you can . insertAfter () . next () element

http://jsfiddle.net/kFTc5/1/

$(".div1").each(function() {
    var item = $(this);

    //either this:
    item.next().after(item);

    //or this:
    item.insertAfter(item.next());


});

Answer 2

Here's how you do cut operations in the DOM using jQuery.

Var temp=  $("div1").detach(); //Performs the cut operation
temp.insertAfter("div2");  //Does the paste