Javascript-форум - Изменение порядка вывода дерева товаров

Добрый день, уважаемые знатоки!
Требуется Ваша помощь в jQuery, т.к. Java Script не мой профиль :( и разбираться просто нет возможности.

Есть древовидное меню:
----------------------------
Расходные материалы
-краска
-картриджы
Комплектующие
-материнки
-процы
-память
и так далее...
----------------------------
Задача: Хочется иметь возможность менять порядок как группы целиком(Расходные материалы, Комплектующие), так и внутри группы (краска, картриджи и тд).

Путем перерываний кучи форумов, доков и тд добился результата и научился передвигать группы :)
Выкладываю код для наглядности

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script>
        <script type="text/javascript">
   
      $('document').ready(function() {
        var order = 0;
        $('#sortable').sortable(
          {
          opacity: 0.6, // меньше прозрачность при перемещении
          update: function() {
            order = $('#sortable').sortable('toArray'); // массив с порядком
            $('p#info').text('Не забудьте сохранить изменения');
          }
          });
        $('button').click(function() {
          $('p#info').load('save.php?items=' + order.join(','));
          
        });
      });
    </script>
    </head>
    <body>

     <?php
      
      require ("db/connect.php");

    		$sql = "SELECT * FROM group_charact WHERE id_group_charact='' ORDER BY `order` DESC";
            $res = mysql_query($sql);
            echo '<ul id="sortable">';
            /*вывод товаров*/
	            while($row = mysql_fetch_object($res))
	            {
	            ?>
				<li id="<?php echo $row->id;?>"> <?php echo $row->order;?>
				<?php echo $row->groupchar;?></li>
	            <?php
	        	}
	        echo '</ul><div class="clear"></div>';

    ?>
    <div>*Для изменения порядка просто перетаскивайте элементы, удерживая левую кнопку мыши.
 Элементы в начале списка выводятся в первую очередь.</div>
<button>Закончить изменение</button>
    <p id='info'>&nbsp;info</p>

</body>
</html>

и файлик для сохранения данных:

<?php
require("db/connect.php");
    

    $itemsArray = array_reverse(explode(',', $_GET['items']));
    for($item = 1; $item <= count($itemsArray); $item++)
    {
      $sql = "UPDATE `group_charact` SET `order`='$item' WHERE `id`='".$itemsArray[$item-1]."'";
      mysql_query($sql) or die('<br />Перемещение не сохранено');
    }
    echo '<br />Порядок был успешно сохранен.';

?>

Заранее благодарен за помощь