JSFiddle - React, Tailwind, and code Playground

HTML

<body class="normal">
	<h1>
		<p>paragraph 1</p>
		<p>paragraph 2</p>
	</h1><br/>
	<button>Normal</button>   <button>Changed</button>
	<script src="script.js"></script>
</body>

CSS

.normal {background-color: white;
		color: black;}
	.changed {background-color: black;
		  color: white;}

JavaScript

var buttons = document.getElementsByTagName("button");

var len = buttons.length;


for (i = 0; i < len; i++) {
  buttons[i].onclick = function() {
    var className = this.innerHTML.toLowerCase();
      document.body.className = className;
  };
}