Binding event to dynamically created elements using jQuery

Question

I am uploading multiple images and placing them inside some divs which onclick have to toggle some class. Do I have to place the part in which I add the onclick event inside

Answer 1

For dynamically created element you have to use .live() However, live() was deprecated in 1.7 in favour of on(), and completely removed in 1.9. The live() signature:

If you have greater version of jQuery than 1.9 you can use jQuery.fn.on

I would recommend to use .on below is a signature of .on function

$(document).on( eventName, selector, function(){} );

$("body").on("click", "#YOUR_DYNAMICALLY_CREATED_ELEMENT", function(event){
    //Do Some stuff
});

Solved version:

$("body").on('click', '.box-picture-selected > div > div', function(event)
{
    $(this).toggleClass('image-selected');
});