Question

Mine is a simple enough question but i tried different ways they did work out.. I have following code . I am creating new <div> and trying to give it a class name test.So when i click on this <div> with class test i am trying to rise alert… Please help me i ma lost….

$('.item').click(function(){
        if(!isFullscreen){ // MAXIMIZATION
            $boxes = $(this).css('width','100%');
            $boxes.addClass("test");
            //$boxes.id = "test"; 
            $('#content').prepend( $boxes ).masonry( 'reload' );
        }
});

$(".test").click(function(){
    alert("Test");

});

I even tried below code: but they did not work

        //$boxes.className="test";
        //jQuery($boxes).attr("id","test");

Thanks in advance…

Answer 1

You should delegate the event:

$("#content").on('click', '.test', function() {
    alert("Test");
});

For adding an ID to the clicked element you can code:

this.id = 'test';

Note that if you add the same ID to several elements, your document becomes invalid.