change all background to transparent

Question

https://codepen.io/jayllopy/pen/bQgRPY

function openNav() {
document.getElementById("mySidenav").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
}

function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft= "0";
document.body.style.backgroundColor = "white";
}

i have this link that changes all background to white opacity 0.4 except #main with bg color red

Q: I want to change #main background to rgba(0,0,0,0.4) when sidenav is open

Answer 1

function openNav() {
    document.getElementById("mySidenav").style.width = "250px";
    document.getElementById("main").style.marginLeft = "250px";
    document.getElementById("main").style.backgroundColor = 'rgba(0,0,0,0.4)';
}

function closeNav() {
    document.getElementById("mySidenav").style.width = "0";
    document.getElementById("main").style.marginLeft= "0";
    document.body.style.backgroundColor = "white";
    document.getElementById("main").style.backgroundColor = 'rgb(255,0,0)';
}

It will change back to red when you close it.