title: Animation when object is in viewport doesn't work
body: <p>I wanted to add some magic to my project and tried to use 
  code from this tutorial <a href="https://codepen.io/charkins/pen/XmVRvr" rel="nofollow noreferrer">https://codepen.io/charkins/pen/XmVRvr</a> but it works only on this codepen. I even copied the same code to  another codepen: <a href="https://codepen.io/anon/pen/qxROQX" rel="nofollow noreferrer">https://codepen.io/anon/pen/qxROQX</a>  and it doesn't work.
  I don't know jquery that much, I would really appreciate little bit of help</p>
  
  <p>Here's JS file, it's suppposed to detect if element is in viewport and then apply animation to it</p>
  
  <pre><code>//need to rewrite in prototype
  //no jquery
  
  $(function() {
    var $blocks = $('.animBlock.notViewed');
    var $window = $(window);
  
    $window.on('scroll', function(e){
      $blocks.each(function(i,elem){
        if($(this).hasClass('viewed')) 
          return;
  
        isScrolledIntoView($(this));
      });
    });
  });
  
  function isScrolledIntoView(elem) {
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();
    var elemOffset = 0;
  
    if(elem.data('offset') != undefined) {
      elemOffset = elem.data('offset');
    }
    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();
  
    if(elemOffset != 0) { // custom offset is updated based on scrolling direction
      if(docViewTop - elemTop &gt;= 0) {
        // scrolling up from bottom
        elemTop = $(elem).offset().top + elemOffset;
      } else {
        // scrolling down from top
        elemBottom = elemTop + $(elem).height() - elemOffset
      }
    }
  
    if((elemBottom &lt;= docViewBottom) &amp;&amp; (elemTop &gt;= docViewTop)) {
      // once an element is visible exchange the classes
      $(elem).removeClass('notViewed').addClass('viewed');
  
      var animElemsLeft = $('.animBlock.notViewed').length;
      if(animElemsLeft == 0){
        // with no animated elements left debind the scroll event
        $(window).off('scroll');
      }
    }
  }
  </code></pre>