title: Add class to div when in viewport
body: <p>I want to add a class to a menu item when a different div enters the viewport. </p>
  
  <p>I have successfully replicated the alert found here: <a href="http://jsfiddle.net/blowsie/M2RzU/" rel="nofollow">http://jsfiddle.net/blowsie/M2RzU/</a> However, when I try to change it from an alert to an addClass or toggleClass it breaks. This is my code:</p>
  
  <pre><code>$('#portfolio').bind('inview', function (event, visible) {
    if (visible == true) {
      // element is now visible in the viewport
      $( "#menu-item-portfolio" ).addClass( ".active-area" );
    } else {
      // element has gone out of viewport
    }
  });`
  </code></pre>
  
  <p>I want to add .active-area to #menu-item-portfolio when #portfolio enters the viewport, then remove it when #portfolio leaves the viewport.</p>