jQuery sortable only works in document ready, not with a button

jQuery sortable only works in document ready, not with a button

Check out the following jsFiddle:
http://jsfiddle.net/PNvvb/1/
I use a sortable div, with items in it. These items are sortable, and use
the jQuery UI Sortable plugin. When I instantiate the items in the
document.ready function, it all works as expected.
But as soon as you click disable, and enable button again, the sortable
plugin does not work anymore.
This also happens when you just use the buttons, and remove the sort(true)
from the document.ready.
Why does jQuery UI sortable do work when the DOM hierarchy has been fully
constructed, and the ready function is triggered, but does not work when
called after this?
HTML:
<div id="sort">
<div class="item">Item 1</div>
<div class="item">Item 2</div>
<div class="item">Item 3</div>
<div class="item">Item 4</div>
</div>
<button id="b1">Enable</button>
<button id="b2">Disable</button>
CSS:
.item {
display:block;
background-color: Yellow;
width: 100px;
margin: 5px
}
.placeholder {
background-color: Green;
width: 100px;
}
Javascript:
$(document).ready(function() {
sort(true); //Remove this line to see if the enable button works from
the start. (which it doesn't)
//These lines are needed for jsFiddle to get buttons to respond to
clicks. See
http://stackoverflow.com/questions/5431351/simple-example-doesnt-work-on-jsfiddle
$("#b1").click(function() {
sort(true);
});
$("#b2").click(function() {
sort(false);
});
});
function sort(enable) {
if(enable) {
$("#sort").sortable({
placeholder: "placeholder",
forcePlaceholderSize: true
});
} else {
$("#sort").sortable({ disabled: true });
}
}