How to add divs inside a div using jquery

Question

I am trying to insert a div inside another div using add() of jquery but it is not working

<div class="column" id="col1">
    <div class="portlet" id="panel1">
        <div class="portlet-header">1.Feeds</div>
        <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
    </div>
    <div class="portlet" id="panel2">
        <div class="portlet-header">2.News</div>

        <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
    </div>
</div>

<div class="column" id="col2">
    <div class="portlet" id="panel3">
        <div class="portlet-header">3.Shopping</div>
        <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
    </div>
</div>

Actually panel1 and panel2 are inside a div, and panel3 is inside another div.I want to remove panel3 from its div and place it between panel1 and panel2 in their div.

Answer 1

You can do it like this using .insertAfter():

$("#panel3").insertAfter("#panel1");​​​​​​​​​​​​​​

This does as your question states, takes panel3 and places it between panel1 and panel2.