可拖动的div不想移动

Question

我创建了一个生成我的表的方法，并在表格单元格中添加了一个div。我想把那个div移到桌子上（在他的牢房里），但我的div并不想移动。有什么想法吗？

这是我的代码：

<script type="text/javascript"> <%@ include file="/resources/js/dynamicTable.js" %></script>
                <button id="add_table" onclick="createDiv()">Add Table</button>

    <div class="static_form_room" id="static_form_room">
    <script type="text/javascript"> 
    <%@ include file="/resources/js/generateTable.js" %>
    </script>
<script type="text/javascript">tableCreate();</script>
</div>

dymanicTable.js

function createDiv() {
    var div = document.createElement('div');
    var body = document.getElementById('room').rows[0].cells[0];//room is my table id
    body.innerHTML = '';

    var img = $('#res_table').css('background-image');
    var width = $('#res_table').css('width');
    var height = $('#res_table').css('height');
    var bg_repeat = $('#res_table').css('background-repeat');
    var bg_size = $('#res_table').css('background-size');
    div.className = 'ui-widget-content';
    div.id = 'dynamicTable';
    div.style.backgroundImage = img;
    div.style.width = width;
    div.style.height = height;
    div.style.backgroundRepeat = bg_repeat;
    div.style.backgroundSize = bg_size;
    div.cursor = 'move';
    body.appendChild(div);
}
$(function() {
    $( "#dynamicTable" ).draggable();
});