nav[role=”navigation”].dark is not working?

I have created a JS function for toggle of dark theme and light theme everything is working but this nav one is not working

nav[role="navigation"].dark{
    background-color: #2a2a2a;
}

And my Javascript

document.getElementById("dark").addEventListener('click', () => {
    document.body.classList.toggle('dark')
    localStorage.setItem(
      'theme',
      document.body.classList.contains('dark') ? 'dark' : 'light'
    )
  })

Answer

If the dark class is apply to the body your selector probably sould be .dark nav[role="navigation"] and not nav[role="navigation"].dark

.dark nav[role="navigation"] {
    background-color: #2a2a2a;
}