Sortable

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>jQuery UI</title>
    <link rel="stylesheet" href="jquery-ui.min.css">
    <script src="./external/jquery/jquery.js"></script>
    <script src="jquery-ui.min.js"></script>
    <style>
    .ui-selected {
      background: red;
    }
  </style>
  </head>
  <body>
  <ul id="sortable">
  <li id="item_1">item1</li>
  <li id="item_2">item2</li>
  <li id="item_3">item3</li>
  <li id="item_4">item4</li>
  <li id="item_5">item5</li>
  </ul>
  <script>
    $(function(){
       $('#sortable').sortable({
        cursor: 'move',
        opacity: 0.5,
        update: function(event, ui){
          $(this).sortable("serialize");
        }
       });
      });
  </script>
  </body>
</html>