Navbar color change after defined y position

I have a nice navbar that is fixed to the top of the window. When a user scrolls past a certain div, it will change the background color of the navbar. Up to this point, it has been working great for me.

I recently added a few anchor links to my website. Now when a user clicks on an anchor link and is brought to the page with the navbar on it, the navbar is not the correct color. It is only when the user scrolls a little, that the navbar changes color. But I would like the navbar to have the correct background color as soon as the user lands on the page.

$( document ).ready(function() {
var mainbottom = $('.changenavcolor').offset().top +        $('.changenavcolor').height();

// on scroll, 
$(window).on('scroll',function(){

// we round here to reduce a little workload
stop = Math.round($(window).scrollTop());
if (stop > mainbottom) {
    $('.os .navbar').addClass('navbarblue');
} else {
    $('.os .navbar').removeClass('navbarblue');
}

});
});