Jquery 添加div时的调用单击事件

我正在使用jQuery构建一个简单的应用程序来保存您的符号。我使用表单和以下脚本将项目添加到列表中：

$(document).ready(function() {
$('.add').click(function() {
    var item = $('#todo')
    if( $('#todo').val().length> 0)  {
        $('div.lists').prepend("<div class='listItem'>"+item.val()+"</div>");
        localStorage["myKey"] = JSON.stringify($(".lists").html());
        $('#itemForm').toggle();
        $('#todo').val(' ')
    }
});
});

我找不到错误。我希望有人能帮助我，提前谢谢

$('div.listItem').on("click",function() {
    $(this).attr('id', '#selected');
});

但这毫无意义，这将添加一个#selected的id

---

这就是您想要做的吗？

如果要使用类而不是id来确定选择了哪个元素，您可以执行以下操作：

$('div.listItem').on("click",function() {
  // Remove any other items with .selected
  $('div.listItem.selected').removeClass('selected');

  // Add class to the clicked element
  $(this).addClass('selected');
});

---

它不起作用，因为您动态添加元素：

$('div.lists').prepend("<div class='listItem'>"+item.val()+"</div>");

---

旁注：我建议使用所选的类

而不是Id，以避免在有多个元素具有相同Id时可能出现的问题。
谢谢khanh，你让我走上了正确的道路。您发布的内容最初不起作用。然后我写了这个

$(document).on("click",'.listItem',function() {
if ( $( this ).hasClass( "selected" ) ) {
$(this).removeClass('selected');
var select=0;
}
else {
$(this).addClass('selected');
var select=1;
}

这就是工作。变量用于其他目的：）
请将代码放在JSFIDDLE上。使用类而不是id可能会更好。如果尝试添加多个同名id，或者删除id并尝试将其应用于其他dom元素，某些浏览器可能会出现问题。
$(document).on("click",'div.listItem',function() {
    $(evt.target).attr('id', '#selected');
});

$(document).on("click",'.listItem',function() {
if ( $( this ).hasClass( "selected" ) ) {
$(this).removeClass('selected');
var select=0;
}
else {
$(this).addClass('selected');
var select=1;
}