The click handler needs to be bound when the link actually exists. You could try it this way:

function resizeSquare() {
        var $square = $('#square');

        $square.animate({ width: "300px", marginLeft: "-150px"}, 800)
        .animate({ height: "400px", marginTop: "-200px"}, 800, function() {
                $(this).html('<a href="#" class="clicked">clicked</a>')
                        .find('a.clicked').click(showAlert);
        });
}

function showAlert() {
        alert("Display me!");
        return false;
}



--Karl

____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com




On Jan 26, 2009, at 6:52 AM, dreame4 wrote:


Hi,

I have function which animates div#square and insert link in this div
(via animate callback):

function resizeSquare() {
        var $square = $('#square');

        $square.animate({ width: "300px", marginLeft: "-150px"}, 800)
        .animate({ height: "400px", marginTop: "-200px"}, 800, function() {
                $(this).html('<a href="#" class="clicked">clicked</a>');
        });
}

and then I want to display alert after click on this inserted link.
This is a function doing this:

function showAlert() {
        $('a.clicked').click(function() {
                alert("Display me!");

                return false;
        });
}

Unfortunately it doesn't work. If I insert this link outside animate
callback it's ok.

Anyone can help?

With regards,
dreame4

Reply via email to