title: Jquery $(this) not working inside function
body: <p>I am trying to use waypoints.js to have elements fadein when scrolling to hit the elements.</p>
  
  <p>I have </p>
  
  <pre><code>$(document).ready(function(){
  
  $('.card').waypoint(function(down) {
      console.log('hit element');
      $(this).addClass('card-fadeIn');
  }, { offset: '100%' });
  
  });
  </code></pre>
  
  <p>What this does is adds the class 'card-fadeIn' which is opacity 1 and an ease in animation.</p>
  
  <p>When I change it to </p>
  
  <pre><code>$('.card').addClass('card-fadeIn');
  </code></pre>
  
  <p>It works fine, but adds opacity 1 to every card class and ruins the fadein effect.  I was trying to use $(this) instead but it wont fadein, nor will it give an error in the console.  Any ideas why?</p>