Having trouble changing classes to diferent tags of html with js and css

Question

I was trying to do the same thing to body but for other tags like button, fieldset, etc

The way to change the body tag for darkmode is "document.body.classList.add("darkmode");" but i need to know the same thing but for other tags like the ones i named before.

My JS code

let darkMode = localStorage.getItem("darkMode");

const enableDarkMode = () => {
    document.body.classList.add("darkmode");
    localStorage.setItem("darkMode", "enable");
}

const disableDarkMode = () => {
    document.body.classList.remove("darkmode");
    localStorage.setItem("darkMode", null);
}

if(darkMode === "enable"){
    enableDarkMode()
}

$("#dark_mode_toggle").click(() => { 
    darkMode = localStorage.getItem("darkMode");
    if (darkMode !== "enable"){
        enableDarkMode();
    }else{
        disableDarkMode();
    }
});

Answer 1

Kinglish's suggestion in the comments does seem right, after all CSS stands for Cascading StyleSheets, but here is a JS solution to what you were asking for.

Since it seems like you are using JQuery, you can do this:

$("button").addClass("darkmode");

---

Without JQuery, you can do this:

document.querySelectorAll("button").forEach(element => element.classList.add("darkmode"));

For other elements, like fieldset, just repeat the code you chose to use from above. I think it should be trivial to figure out how to disable the dark mode using the code you already have and this.