Can anybody tell me why this is not working?

Question

https://code.sololearn.com/Wg36z9eSbdba/?ref=app

Answer 1

Why there is 2 same function?

https://code.sololearn.com/WXPMx0Si5019/?ref=app

Answer 2

* In HTML pane:
Make the div#dark-light be the control for dark mode switch. So when you click on it, dark mode switches on/off

<div id="dark-light" onclick="toggle()">
<button id="But"></button>
</div>

* In CSS pane:
Add background-color property for div#dark-light so it will still be visible when you switch dark mode on/off.

#dark-light
{
...
background-color: #fff;
}

* In JS pane:
function toggle()
{
var But = document.getElementById( "But" );
document.body.classList.toggle( "dark-mode" );
var darkMode = document.body.classList.contains( "dark-mode" );
But.style.marginLeft = ( darkMode ? "73px" : "0px" );
}

Answer 3

to use onClick the function has to be inside the HTML tag to be called from js add an EventListener to the button
document.getElementById("btn_togle").addEventListener("click", function(){
toggle();
});

Answer 4

As always, it doesn't work for me if I don't put all the code inside
window.onload=()=>{//code}

Remove the onclick attribute in the HTML and use what Paredes says
But.addEventListener("click",toggle );

Also, as AJ says, you are defining the same function twice