JSFiddle - React, Tailwind, and code Playground

HTML

<body class="page light-theme">

<button type="button" id="btnColor" class="theme-color">DARK-theme</button>

</body>

CSS

@import url('https://fonts.googleapis.com/css2?family=Neucha&display=swap');


* {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: 'Neucha', cursive;
}

.dark-theme {
  background: #999;
}

JavaScript

let page = $('.page');
 $('#btnColor').click(function() {
   page.toggleClass('dark-theme light-theme');
   if (page.hasClass('dark-theme')) {
     $(this).html('LIGHT-theme');
   } else {
     $(this).html('DARK-theme');
   }
 });