Clever Geek Handbook

Why is jQuery on () not working on existing elements?

I have a div with the #editor id. Inside the div there is an image with the class .float-right. I am also dynamically adding new images with the same class to the #editor div. The jQuery code below works with newly added images, but not existing ones. What for? I need it both ways.

Html

<div id="#editor">
    <img src="img.jpg" class="float-right">
    <!--jQuery will select this image only if added after page load -->
</div>

JQuery

$('#editor').on('click', '.float-right', function() {
//Do stuff
});

Rough code I'm working on http://jsfiddle.net/kthornbloom/9tdDa/ (this is the wysiwyg html5 editor)

+3


source to share


1 answer


You prevent all click events for existing child #editor elements with

$("#editor").children().click(function(){
    return false;
});


remove it (in 2 places) and it works. It does not affect new elements as it is intended only for existing ones.

http://jsfiddle.net/9tdDa/5/

+3


source






More articles:


All Articles