Запустить jQuery для новых элементов DOM

Question

Как запустить сценарий jQuery для новых созданных элементов DOM? Посмотрите на следующий код, если я нажму на класс .elem, он запустит код, но если я добавлю новый .elem, сценарий не будет запущен.

JS:

$('.elem').on('click', function(){ 
    $('.result').show().fadeOut('slow'); 
}); 
$('.add').on('click', function(){ 
    $('.block').append('<div class="elem">Element</div>'); 
}); 

HTML:

<div class="block"> 
    <div class="elem">Element</div> 
    <div class="elem">Element</div> 
    <div class="elem">Element</div> 
</div> 

<p><span class="add">Add new</span></p> 

<div class="result">Result</div> 

JSFiddle здесь:http://jsfiddle.net/3Y3Cn/3/

Любая помощь ценится. Них чрезвычайно Спасибо вам;

Answer 1

Использование event delegation с любым статического родительского элемента:

$('.block').on('click', '.elem', function() { 
    $('.result').show().fadeOut('slow'); 
}); 

DEMO:http://jsfiddle.net/3Y3Cn/4/

Answer 2

Вы должны использовать event delegation:

$('.block').on('click', '.elem', function(){ 
    $('.result').show().fadeOut('slow'); 
});