单击my jquery未触发的事件

单击my jquery未触发的事件,jquery,html,json,Jquery,Html,Json,我将一个xml文件保存到一个json对象中,然后在标题中循环以在容器中显示它,然后尝试单击标题,但什么也没有发生 $(document).ready(function() { $.get("Titles.xml", function(data, status) { var jsonObj = $.xml2json(data); $("#videoListTmpl").tmpl(jsonObj).appendTo("#titlesContainer"); }); $(".vide

我将一个xml文件保存到一个json对象中,然后在标题中循环以在容器中显示它,然后尝试单击标题,但什么也没有发生

$(document).ready(function() {
$.get("Titles.xml", function(data, status) {
    var jsonObj = $.xml2json(data);
    $("#videoListTmpl").tmpl(jsonObj).appendTo("#titlesContainer");
});

$(".videoItem").on('click', function() {
    console.log("this is the click");
});
Html文件

<body>
<div id="container" style="margin-right: auto;margin-left: auto;width:960px;clear:both">
<div style="margin:0 auto;width:260px;float:left;height:400px;overflow:scroll" id="titlesContainer"></div>
<div style="margin:0 auto;width:670px;float:right;" id="titleContainer"></div>
</div>
<script id="videoListTmpl" type="text/x-jquery-tmpl">
    {{each Titles}}
        <div class="videoItem" style="cursor:pointer">
            ${titles}
        </div>
    {{/each}}
</script>

{{每个标题}}
${titles}
{{/每个}}
关于事件未触发的原因,有什么建议吗?

请尝试代理

 $(document).on('click',".videoItem", function() {
    console.log("this is the click");
});
或者将其委托给文档中最近的父元素

$("#titlesContainer").on('click',".videoItem", function() {
     console.log("this is the click");
});

如果您想了解更多有关事件的信息,请浏览,您的代码看起来不错。尝试将上的
功能添加到
文档。就绪