Jquery UI ConnectБез подключения

Я пытаюсь использовать пользовательский интерфейс Jquery, сортируемый для подключения списков сортируемых элементов. Кажется, все работает нормально, но я не могу заставить свойство connectWith что-либо делать.

У меня есть довольно простая HTML-страница:

<div id="easy"></div>
<div id="medium"></div>
<div id="hard"></div>

и еще немного JQuery:

var puzzles = {
    easy: [1,2,3,4,5,6,7,8,9],
    medium: [1,2,3,4,5,6],
    hard: [1,2,3,4,5,6,7]
};

for (var i in puzzles) {
    $("#" + i).append("<ul class='" + i + " '>");
    for (var j = 0; j < puzzles[i].length; j++) {
        $("ul." + i).append("<li id='" + i + "_" + j + "' class='" + i + "'>" + (j + 1) + "</li>");
    }
}

$("ul").sortable({
    connectWith: "ul"
}).disableSelection();

У меня есть демонстрационная страница на JsFiddle.

Списки будут хорошо сортироваться, но почему они не соединятся?