Repeat a jQuery AJAX POST function

Question

I have a clickable div loading the next 5 comments from my database, sort of how Twitter loads new tweets into your timeline. I have a few other POST functions in my code and they can be fired off multiple times, but this one won't.

Here's the code - the comments are returned from a URL (the site is codeigniter), inserted into a hidden div, then the div is slid down.

$(".content .load-more-comments").live("click", load_messages);
function load_messages() {
 var offset = 10;
 var count = 5;
 $.post((site_url+'project/load_more_messages/'+project_id), { count:count, offset:offset }, function(data) {
  if(data) {
   var more_messages = data;
   $("ul.messages").append('<div class="slidedown" style="display:none;">'+data+'</div>');
   $("ul.messages div.slidedown").slideDown(1000);
   var offset = offset+5;
  } else {
   $("ul.messages").append('<p class="error">Additional messages could not be loaded.</p>');
  };
 });
 return false; 
};

Like I said, it works fine the first time, but after that, no dice. My guess is that something in the function is still running, but I tried to end anything running and that didn't work.

Answer 1

These are the offending lines:

var offset = 10;
var count = 5;

Everytime a click occurs your offset & count be reset to 10 & 5 respectively. Methinks you need to make these variable declarations global, outside the load_messages() function.