You need to bind the sortable after you create your dynamic list items. Otherwise when you bind the sortable, it doesn't know which element to bind to as the element doesn't exist.
One more improvement. You are binding the sortable to the parent <ul>
element, if you want only the <li>
elements to be able to sorted.
So try the following.
$('#sortable').sortable({
items: ' > li',
});
Having said that it should work as it is right now because the default is > *
. You can read more over here.