jQuery How do I move an element inside of another element

Question

Hi I'm using grails navigation plugin and when it generates menus it put the sub navigation underneath the main menu, but i'm making my menu a vertical menu so i don't want the sub menu under the whole menu i want it under the active element.

Example: this is how it generate the menu and sub menu

<ul class="mainmenu">
   <li>item1</li>
   <li>item2</li>
   <li>item3</li>
</ul>
<ul class="submenu">
   <li>item1</li>
   <li>item2</li>
   <li>item3</li>
</ul>

What i want is:

<ul class="mainmenu">
   <li>item1
     <ul class="submenu">
       <li>item1</li>
       <li>item2</li>
       <li>item3</li>
     </ul>
   </li>
   <li>item2</li>
   <li>item3</li>
</ul>

Since i don't know of a way to make grails nav plugin do this i guess i'll have to make jquery do it after it's generated. Any ideas?

---

Edit

So the jquery i used from the answer below is:

<script type="text/javascript"> 
$(function() {
        alert("hi");
        $(".subnavigation").appendTo($(".navigation li:navigation_active"));
      });
</script>
....
<ul class="navigation" id="navigation_tabs">
    <li class="navigation_first">Item 1</li>
    <li class="navigation_active">Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li class="navigation_last">Item 5</li>
</ul> 
<ul class="subnavigation" id="subnavigation_tabs">
    <li class="subnavigation_first">Sub 1</li>
    <li>Sub 2</li>
    <li class="subnavigation_last">Sub 3</li>
</ul>

This seems like it should work but the menu still looks the same with all the sub items down below.

Answer 1

You can do this:

$(".submenu").appendTo($(".mainmenu li:first"));

Alternatively:

$(".mainmenu li:first").append($(".submenu"));

Or, to put it under all of them (hide by CSS):

$(".mainmenu li").append($(".submenu"));

Edit, for the updated question:

$(".subnavigation").appendTo($(".navigation li.navigation_active"));

Answer 2

Assuming with active you mean mouse hovering.

$("ul.mainmenu li").hover(function() {
    $(this).append($("ul.submenu"))
})