[jQuery] jquery within ajax response
I'm not sure why I'm having an issue with this, but what I have is an
ajax response which contains some more javascript.
When I retrieve the page directly, the jquery functions work fine, but
when I load the page into another page via an ajax request, none of
the functions work.
I can launch a javascript alert when the requested page loads, but
none of my jquery stuff works.
The requested page (the one that doesn't work) is below - if that
helps.
[ code]
<html>
<head>
<title>getting users from Facebook</title>
<script type="text/javascript" src="scripts/jquery-1.2.1.js"></script>
<script type="text/javascript" src="scripts/suggest.js"></script>
<script type="text/javascript" src="scripts/dimensions.js"></script>
<script type="text/javascript" src="scripts/autocomplete.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".addFriend").click(function(event) {
var id = this.id
var posTop = event.pageY-30;
var posLeft = event.pageX-30;
alert(id);
$.ajax({
type: "GET",
url: "addFriendForm.php",
success: function(response){
$("#addFriend").css({ position: 'absolute', top: posTop, left:
posLeft });
$("#addFriend").fadeIn("slow").html(response);
}
});
});
});
</script>
</head>
<body>
<a id="1047168999" class="addFriend"><img src="http://
profile.ak.facebook.com/profile5/692/46/s1047168999_6023.jpg">NextweeQ
Testub<br /></a>
<a id="1059049145" class="addFriend"><img src="http://
profile.ak.facebook.com/profile5/1033/100/
s1059049145_4228.jpg">Nextweeq Testuc<br /></a>
<a id="1069969064" class="addFriend"><img src="http://
profile.ak.facebook.com/profile5/1/121/s1069969064_2081.jpg">Nextweeq
Testud<br /></a>
<form action="addFriend.php" method="get" id="addFriend" ></form>
</body>
</html>
[/code]