[jQuery] Load new content, new links dont activate jquery function..
Hi, im quite new to jquery so not sure what im doing wrong. (or if
what im doing is the best way). But here goes, i have a rating script,
that allows ratings between 1-10.
The HTML:
<div id="userrate">User Rating is 7.8/10</div>
The current rating is fetched from a mysql database with php.
<div id ="clickrate">1 2 3 4 5 6 7 8 9 10 | Your current rating is 5!</
div>
1-10 are links that have the href="rate.php?rate=1" or "rate.php?
rate=2" etc
My Jquery is as follows:
----------------------------------------------------
$('#clickrate a').click(function(){
var toLoad = $(this).attr('href');
$.get(toLoad, function(){
$("#clickrate").fadeOut("fast");
$("#userrate").fadeOut("fast");
$('#clickrate').load("http://www.site.com/mypage #clickrate",
function() {
$('#clickrate').fadeIn("slow");
});
$('#userrate').load("http://www.site.com/mypage #userrate", function
() {
$('#userrate').fadeIn("slow");
});
});
return false;
});
-----------------------------------------------
Which gets the href value of the clicked link in the div with the
id="clickrate" and makes a request for the href which should be
="rate.php?rate=1" if the link with the rating of 1 is clicked,
rate.php then updates the databse...
Then i use Jquery's .load to display the new #clickrate and #userrate
with the current rating.
This all goes well, except that once the new #clickrate and #userrate
is loaded if i click on any rating again the whole process is not
repeated through jquery, the browser simply loads the page "rate.php?
rate=1"... why is the click not captured and the the #clickrate and
#userrate divs not updated?....
Also it would be great i there was a way to reload both the #clickrate
and #userrate divs with one .load statement.. like:
$('#clickrate #userrate').load("http://www.site.com/mypage #clickrate
#userrate", function() {
this dosnt seem to work :(
Help please!