JSFiddle - React, Tailwind, and code Playground

HTML

<label for="mode"><input id="mode" type="checkbox"> Dark Mode</label>
<h1>Some Heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat quidem dolore quae temporibus consectetur quibusdam enim nam! Repellat odio fuga exercitationem deleniti nam dolorum culpa obcaecati consectetur odit in ducimus!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus dicta ad est molestias impedit explicabo quas odio animi nobis et doloremque consequatur temporibus ex sapiente voluptatibus autem quo debitis. Totam.</p>

CSS

/* The original styles */
h1 {
    color: blue;
}
p {
    color: green;
}

/* Dark Mode styles */
body.dark-mode {
    background: black;
}
.dark-mode label {
    color: white;
}
.dark-mode h1 {
    color: yellow;
}
.dark-mode p {
    color: orange;
}

JavaScript

$('#mode').change(function(){   
    
    if ($(this).prop('checked'))
    {
        $('body').addClass('dark-mode');
    }
    else
    {
        $('body').removeClass('dark-mode');
    }
    
});