Add nav class on scroll

[ckubs]

I'm using this piece of JS to add a css class to the main nav after I start to scroll the page.

$(document).ready(function() {
    var header = $("#header-menu");
  
    $(window).scroll(function() {    
        var scroll = $(window).scrollTop();
        if (scroll >= 50) {
            header.addClass("scrolled");
        } else {
            header.removeClass("scrolled");
        }
    });
  
});

But it only works after page reload. First time opening a page, it doesn't work. I reload the page it works. Had the same problem trying to add button ripples but forgot about the $(document) and that solved the problem.

If someone has any clue about this and is kind to give a little help

[PitaJ]

Are there any errors in the js console?

[ckubs]

@PitaJ No error. But after your reply looked again and saw what I guess is the default way of doing this on Nodebb. And with $(window).on('action:ajaxify.end', function( ) it works as it should. Thank you.