title: Pass anchor tag IDs to AJAX calls
body: <p>My program is to display if there is an event on a specific date in a calendar. I go to my database to check if a date is with an event and echoes it to the user.</p>
  
  <p>I have a loop that will generate multiple values, the ID will end up as their corresponding ID on the database.</p>
  
  <p>Here is the tag that will have multiple IDs: </p>
  
  <pre><code>echo "&lt;br /&gt;&lt;a class='popper' id='$event_id' data-popbox='pop2' href='#'&gt;See more...&lt;/a&gt;&lt;br /&gt;";
  </code></pre>
  
  <p>how can I pass the IDs to this ajax call(my function is to hover for the link for the user to see a popbox with the details)?</p>
  
  <pre><code>$(function() {
  
   $( "#pop2" ).load( "GET.php", { eventid: &lt;?php echo $event_id; ?&gt; }, function() {});
  var moveLeft = 0;
  var moveDown = 0;
  
  $('a.popper').hover(function(e) {
      var target = '#' + ($(this).attr('data-popbox'));
          $(target).show();
          moveLeft = $(this).outerWidth();
          moveDown = ($(target).outerHeight() / 2);}, 
  
  function() {
  var target = '#' + ($(this).attr('data-popbox'));
  
      $(target).hide();
          });
  
      $('a.popper').mousemove(function(thisEvent) {
          var target = '#' + ($(this).attr('data-popbox'));
          leftD = e.pageX + parseInt(moveLeft);
          maxRight = leftD + $(target).outerWidth();
          windowLeft = $(window).width() - 40;
          windowRight = 0;
          maxLeft = e.pageX - (parseInt(moveLeft) + $(target).outerWidth() + 20);
              if(maxRight &gt; windowLeft &amp;&amp; maxLeft &gt; windowRight)
                  {
                  leftD = maxLeft;
                  }
          topD = e.pageY - parseInt(moveDown);
          maxBottom = parseInt(e.pageY + parseInt(moveDown) + 20);
          windowBottom = parseInt(parseInt($(document).scrollTop()) + parseInt($(window).height()));
          maxTop = topD;
          windowTop = parseInt($(document).scrollTop());
              if(maxBottom &gt; windowBottom){
                  topD = windowBottom - $(target).outerHeight() - 20;
                  } 
              else if(maxTop &lt; windowTop){
                  topD = windowTop + 20;
                  }
          $(target).css('top', topD).css('left', leftD);
  });
     });
  </code></pre>
  
  <p>My main problem is, only one value is being returned when I hover different links for events. How can I pass the specific ID of what the user hovered and query it in my PHP file.</p>
  
  <p>Thanks in advance for answering! :)</p>