Changing background color drop down menu via Jquery

Bootstrap Studio Help
1

Hi,

I'm trying to change the background color of the navbar when someone clicks on the hamburger icon and the user has not yet scrolled down (since then the background color is already changed to white, also via Jquery script).

However, I'm running into an issue. For some reason I can change the background when a user clicks the button, but when they click again it does not change back.

The code I wrote:

var startY = $('.navbar').height() * 0; 

function checkScroll(){
    if($(window).scrollTop() > startY){
        $('.navbar').addClass("scrolled");
    }
    else{
        $('.navbar').removeClass("scrolled");
    }
}

$(".navbar-toggler").click(function(){
    if($(window).scrollTop() == startY){
        if($(".navbar-toggler").attr("aria-expanded", "false")){
            console.log("if werkt")
            $(".navbar").addClass("scrolled");
        }
        else if($(".navbar-toggler").attr("aria-expanded", "true")){
            console.log("else werkt");
            $(".navbar").removeClass("scrolled");
        }
    }
});


if($('.navbar').length > 0){
    $(window).on("scroll load resize", function(){
        checkScroll();
    });
}

Can someone point me in the right direction here?

Thank you in advance!