在dynamicllay创建的元素上应用JQuery UI

Question

我正在使用ASP.NET（VS2012，C＃）开发Web应用程序。我想使用JQuery UI可拖动和可调整大小。它们在静态对象（即最初出现在我的HTML中的对象）上工作正常，但是如何将这些好的效果应用于使用javascript动态创建的元素？

这是我如何使用JS添加动态元素：

var id =
    x[4] +
    "^" +
    x[0] +
    "^" +
    x[3] +
    "^" +
    x[2] +
    "^" +
    x[3] +
    "^" +
    x[5] +
    "^";

var eventdiv =
    "<div class='dragresize' id='" +
    id +
    "' onfocus='X()' onclick='ShowEditBox(this.id,event)' style='width:50%; cursor:hand; cursor:pointer; background-color:" +
    x[3] +
    "; border-style:solid; border-color:white; border-width:1px; height:60%'>";

if (x[0] != "")
    eventdiv += x[0];
else
    eventdiv += "(No title)";

eventdiv += "</div>";

document
    .getElementById('<%=tblWeek.ClientID %>')
    .getElementsByTagName("tr")[j + 1]
    .getElementsByTagName("td")[1 + i]
    .childNodes[0].innerHTML += eventdiv;

$(".dragresize").on("load", function () {
    alert('a');
    $(this).draggable();
    alert('c');
});

但是$(".dragresize").on("load", function () {中的代码永远不会运行，这里出了什么问题？

提前致谢