Switching theme of my website

One possible solution by example: say you have a div element that you wish to color its background differently in each theme. Load both .less files and edit them like this (add the theme class to the body element that wraps the whole document):

theme-1.less

body.theme-1 {
    div.address {
        background-color: yellow;
    }
}

theme-2.less

body.theme-2 {
    div.address {
        background-color: fuchsia;
    }
}

Then provide a mechanism for the user to change the theme (e.g. drop-down menu). When the user selects from the menu - say for example changing from theme-1 to theme-2 - issue this JS:

document.getElementsByTagName("body")[0].classList.replace("theme-1", "theme-2");

Generically you can do it in more than one way:

document.getElementsByTagName("body")[0].classList.replace(<currently-selected-theme>, <newly-selected-theme);

or

document.getElementsByTagName("body")[0].classList.remove(<currently-selected-theme>).add(<newly-selected-theme>);