Добавить событие click к добавленному элементу

Question

Я пытаюсь добавить событие click к элементу, который я добавил через jQuery. Если у меня есть элемент в моем HTML-коде, событие click прекрасно работает. Я надеюсь, что код объясняет это лучше

HTML

<div id="addNew">Add new Item</div> 
<div id="priceWrapper"></div> 
<div class="price"></div> 

JS

var data; 
$('#addNew').click(function() { 
    $('#priceWrapper').append('<div class="item" data-js="2.5" id="Item" >(I dont work i was not here on load)I AM AN ITEM WICH COSTS 2.5€</div>'); 
}); 
$('#Item').click(function() { 
    data = $(this).attr("data-js"); 
    alert(data); 
}); 

Пример в JsFiddle

Спасибо за вашу помощь

Answer 1

Использование jQuery .on. Более подробная информация here

var data; 
$('#addNew').click(function (e) { 
    e.preventDefault(); 
    $('#priceWrapper').append('<div class="item" data-js="2.5" id="Item" style="background-color:yellow;border-bottom:solid 5px green">(I dont work i was not here on load)I AM AN ITEM WICH COSTS 2.5€</div>'); 
}); 

$('body').on('click', '.item', function() { 
    data = $(this).attr("data-js"); 
    alert(data); 
}); 

Fiddle

---

Причина это не работает, потому что в первую очередь, только один элемент может иметь id в то время. Мы должны установить его для использования класс.item. Другая проблема заключается в том, что событие получает , когда страница загружается, поэтому она не замечает новые элементы.