Jquery：ajaxstart不适用于动态创建的元素

Question

我的Html看起来像这样。

   <div id="buildSelectionDialog" title="Select Build" >
        <div id="buildsListWrapper">
            <table id="buildsListTable" class="dataTable" cellpadding="0" cellspacing="0" border="1px solid #fff" width="100%">
                <thead>
                    <tr>
                        <th>Build</th> <th>Type</th> <th>Time</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>

            <input type="hidden" id="dialogPurpose" name="data" value="" />
        </div>
</div>

将使用ajax动态填充表的内容，并且有许多这样的表。现在，我应该修改代码以添加一个微调器，它应该在ajax工作时显示。我通过引用This link添加了一个如下所示的脚本。我创建了一个div，它有要显示的微调图像。

<script>

var $loading = $('#loadingDiv').hide();

$(document)
  .ajaxStop(
    function () { $loading.hide(); }

    )
  .ajaxStart(
    function () { console.log("ajax called"); $loading.show(); }

    );

</script>

这不起作用。我不知道为什么。如果我使用beforeSend和complete向每个ajax请求添加微调器，一切正常。但我想要的是我希望在ajax请求工作时显示微调器图像。我怎样才能做到这一点。