Why doesn’t this work?

Question

Just tell me why it doesn’t work and how to fix it
https://code.sololearn.com/WdMtYPX1stHd/?ref=app

Answer 1

warp your code inside document.ready method
and change your click handler to change handler

Hidden input elements doesn't activate the event handler so instead "display: hide" hide it with this.

.onoffswitch-label {
position: absolute;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px,1px,1px,1px);
}

Or you could add the click handler to the label tag instead

Answer 2

Huh, it was only because your document hasn't loaded you have to set your jQuery into an onload = () => {...} function and it will work 😅.