Getting started with the sortable widget
The final interaction helper that we're going to look at is the sortables component. This component allows us to define one or more list of elements (not necessarily actual <ul> or <ol> elements), where the individual items in the list(s) can be reordered by dragging. The sortables component is like a specialized implementation of drag-and-drop, with a very specific role. It has an extensive API, which caters for a wide range of behaviors.
A basic sortable list can be enabled with no additional configuration. Let's do this first, so that you can get an idea of the behavior enabled by this component. In a new file in your text editor, add the following code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Sortable</title>
<link rel="stylesheet" href="development-bundle/themes/redmond/jquery.ui.all.css">
<script src="js/jquery-2.0.3.js"></script>
<script...
