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