How to make sure that when you reload the page, or when you first enter the site, the rules apply?

Question

JavaScript

Hello, there is a site novodomsip.ru, a small script has been written, when narrowing the screen, add a certain class, and when expanding, remove it. This design works, but when the page is reloaded, or when you first log in from a mobile phone, the classes are not added, please tell me what could be the reason?

Script code

$(document).ready(function(){

$(window).resize(function(){
var windowWidth = $(window).width();
if(windowWidth < 995) {
$(".nav-pills ").addClass('pillses');
$(".navbar").removeClass('home-nav');
$(".pulmarg").addClass('pulmarg1');
}
if(windowWidth > 995) {
$(".nav-pills").removeClass('pills');
}
});
});

$(document).ready(function(){

$(window).load(function(){
var windowWidthloader = $(window).width();
if(windowWidthloader < 995) {
$(".nav-pills") .addClass('pillses');
$(".navbar").removeClass('home-nav');
$(".pulmarg").addClass('pulmarg1');
}
if(windowWidthloader > 995) {
$( ".nav-pills").removeClass('pillses');
$(".pulmarg").removeClass('pulmarg1');
}
});
});

Answer 1

well, maybe you only add them when resizing,
write down what you have in resizing also in ready
ps, so let's say from the fact that you put the resize in the read - nothing has changed. it will work all the same only at resize in your case.