Question

My problem is probably easiest explained from this fiddle: http://jsfiddle.net/L3zVY/7/

If you click the image in the top right of the box, the boxes fade away (image isn’t present so it’s just a question mark).

If I try and dynamically manipulate these boxes instead of them being hardcoded then this functionality is lost for some reason.

The reason I am doing it this way is because I have a login page using a box that changes class depending on the error message. Everything works fine except for being able to close the box…

Any ideas?

Code:

$(document).ready(function() {
// Close notifications (fade and slideup)

        $(".notification a.close").click(function () {
            $(this).parent().fadeTo(400, 0, function () {
                $(this).slideUp(200);
            });
            return false;
        });


// JQuery Broken Notification:
    $("#msgbox1").html('Broken :( <a href="#" class="close"><img src="images/notification_close.png" alt="close" /></a>');

});

Answer 1

http://jsfiddle.net/L3zVY/8/ You need to use the live() function with jquery.