title: Multiple mouseovers and AJAX calls
body: <p>I am creating a jQuery popup that displays user info with AJAX when mousehovered over the username. It works, but only the first time. If I move the mouse out and the popup dissapears, and then hover again over the username, the popup is blank (seems like the AJAX calls is not repeated more than once).</p>
  
  <p>Could someone suggest the reason for this?</p>
  
  <p>EDIT: new cleaned up code (the problem still not solved, just made the code easier to follow):</p>
  
  <pre><code>$(function(){
  var hideDelay = 300;
  var currentID = 0;
  var hideTimer = null;
  var container = $('&lt;div id="personPopupContainer"&gt;' + '&lt;/div&gt;');
  
  var displayPopup = function(){
      currentID = $(this).attr('rel');
  
      if (hideTimer != null) {
          clearTimeout(hideTimer);
      }
  
      var position = $(this).offset();
      container.css({
          left: position.left + 90 + 'px',
          top: position.top + 15 + 'px'
      });
  
      $.ajax({
          type: 'GET',
          url: '/process.cfm',
          data: 'id=' + currentID,
          success: function(data){
              $('#personPopupContainer').html(data);
  
              if ($(data).find('#personPopupResult').length) {
                  var text = $(data).find('#personPopupResult').html();
                  $('#personPopupContainer').html(text);
              }
          }
      });
  
      container.css('display', 'block');
  }
  
  var hidePopup = function(){
      if (hideTimer) {
          clearTimeout(hideTimer);
      }
  
      hideTimer = setTimeout(function(){
          container.css('display', 'none');
      }, hideDelay);
  }
  
  var allowPopupMouseover = function() {
      if (hideTimer) {
          clearTimeout(hideTimer);
      }
  }
  
  $('body').append(container);
  $('.personPopupTrigger').live('mouseover', displayPopup);
  $('.personPopupTrigger').live('mouseout', hidePopup);
  $('#personPopupContainer').mouseover(allowPopupMouseover);
  $('#personPopupContainer').mouseout(hidePopup);
  </code></pre>
  
  <p>});</p>