javascript – 如何使动态创建的元素draggable()？

我想知道如何使动态创建的div可拖动,所以我创建了 this very simple thing来帮助我.我明白我必须使用on()事件与非动态处理程序.通过使身体元素处理链接的JSfiddle中的克隆事件,我已经成功地使动态创建的div可克隆,但它们不可拖动.我究竟做错了什么？

谢谢你提前帮忙！

$(document).ready(function () {
    $("body").on('click','.pink',function () {
        $('.container').append($("<div class='bl pink'></div>"))
    });
    $("body").on('click','.blue',function () {
        $('.container').append($("<div class='bl blue'></div>"))
    });
    $("body").on('click','.coral',function () {
        $('.container').append($("<div class='bl coral'></div>"))
    });
    $(".draggable").draggable();
});

解决方法

在创建时,将类“draggable”或id放在元素中. (你没有上课),然后代码应该工作

$('.container').append($("<div class='bl pink draggable'></div>"));
$('.draggable').draggable()