Jquery On page scroll show particular HTML portion

Jquery On page scroll show particular HTML portion
 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
<div class="old_show">
Scroll intoview comments
</div>
<div class="new_show" style="display:none;">
Show contents data
</div>

<script type="text/javascript">
$(document).ready(function() {
    jQuery(window).scroll(function() {
        if (scrollView(".old_show")) {
            $('.new_show').show();
            $(window).unbind('scroll');
        }
    });

    function scrollView(elem)
    {
        firstScroll = true;
        var docViewTop = $(window).scrollTop();
        var docViewBottom = docViewTop + $(window).height();
        var elemTop = $(elem).offset().top;
        var elemBottom = elemTop + $(elem).height();
        return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
    }

});
</script>

OUTPUT:

Scroll intoview comments

after reach mentioned div

Scroll intoview comments

Show contents data