Right now, I have it so a button appears after scrolling a certain length down the page but once you click on the button and it brings you to #ordersection, I can't get the button to disappear (when it reaches #ordersection). Right now, I have

var mediaQuery = window.matchMedia( "(max-width: 768px)" );
if (mediaQuery.matches) {
    // window width is at less than 768px
    $(document).scroll(function () {
        var y = $(this).scrollTop();
        if (y > 23500 && y < 40000) {
            $('.order-now-btn-a').fadeIn();
        } else {
            $('.order-now-btn-a').fadeOut();
        }
    });
}
else {
    // window width is greater than 768px
    $(document).scroll(function () {
        var y = $(this).scrollTop();
        if (y > 1000 && y < 80000) {
            $('.order-now').fadeIn();
        } else {
            $('.order-now').fadeOut();
        }
    });
} 

'''