How can I change whole site color with toggle a button

Thanks for the code the issue that I’ve got is I moved the icon from the header to the page and I see an error please see the screenshot

In the preview when the dark mode is on the icon is black :

and when the dark mode is off the icon is white!

$w . onReady ( function () {
$w ( ‘#darkModeSwitch’ ). onChange ( function () {
if ( $w ( ‘#darkModeSwitch’ ). checked ) {
$w ( ‘Document’ ). background . src = ‘https://dummyimage.com/1/333333’ ;
$w ( ‘#darkModeState’ ). text = ‘Dark Mode On’ ;
$w ( ‘#emailIcon’ ). src = ‘https://static.wixstatic.com/media/d04120_2cd897ba7a2246a396bfa8a23dad40ef~mv2.png’ ;
} else {
$w ( ‘Document’ ). background . src = “https://static.wixstatic.com/media/d04120_2636c2ad09774cd597ccfb1e9f929e25~mv2.png” ;
$w ( ‘#darkModeState’ ). text = ‘Dark Mode Off’ ;
$w ( ‘#emailIcon’ ). src = ‘https://static.wixstatic.com/media/d04120_a2f9e9ccd89744d5af2cd1e4bb652e6b~mv2.jpg’ ;
}
});
});

should I paste the code in the home or just keep it in the masterPage.js ?

Thanks