Run code when a specific html element is visible on a page

run-when-in-view.js

var $findit = jQuery('#visualisation'); // element that needs to be in view for thing to happen
  
  function Scrolledit() {
        $findit.each(function() {
            var $section = jQuery(this),
                finditOffset = $section.offset(),
                finditTop = finditOffset.top,
                finditBottom = $section.height() + finditTop,
                scrollTop = jQuery(document).scrollTop(),
                visibleBottom = window.innerHeight,
                prevVisible = $section.prop('_visible');
            
            if ((finditTop > scrollTop + visibleBottom) ||
                 finditBottom < scrollTop) {
                visible = false;
            } else visible = true;
            
            if (!prevVisible && visible) {
                animate_path(); // this is where the code goes that you want to happen when the element is visible
            }
            $section.prop('_visible', visible);
        });
       
    }

    function Setupit() {
        var $top = jQuery('#top'),
            $bottom = jQuery('#bottom');

        $top.height(500);
        $bottom.height(500);

        jQuery(window).scroll(function() {
            Scrolledit();
        });
    }

    jQuery(document).ready(function() {
        Setupit(); 

    });