Tengo el siguiente código que funciona aunque funciona muy lentamente, me siento. Lo que quiero hacer es permitir.<li>'s para ser movido libremente bajo existente<ul>'s o subirlos un nivel. También quiero poder crear jerarquías por lo que si arrastra un<li> debajo de otro<li> Eso crearía una jerarquía. Creo que en ese sentido tendría que hacer una<ul> debajo de cada<li> por si acaso. Solo quiero limitarlo a 2 o 3 niveles de profundidad.

$("#sort_list").sortable({
  containment: 'parent',                                                                                     
  axis: 'y',
  revert: true,
  opacity: 0.8
});
$(".sub_list").sortable({ 
  containment: 'parent',
  axis: 'y',
  revert: true,
  opacity: 0.8,
});
$("#sort_list").disableSelection();

<ul id="sort_list">
  <li>one</li>
  <li>two
    <ul class="sub_list">
    <li>sub one</li>
    <li>sub two</li>
    </ul>
  </li>
  <li>three</li>
  <li>four</li>
</ul>