JSFiddle - React, Tailwind, and code Playground

HTML

<button class="" type="button" id="btn"  onclick="changeColor()">Click Me to add class</button>

CSS

.btn{
  padding:20px 10px;
  color:white;
  border:none;
}

.red{
  background-color:red;
}

.green{
   background-color:green;
}

JavaScript

function changeColor() {
const btn = document.querySelector('#btn');

// print existing classes
console.log(btn.className); // 

// add new class
btn.className += 'btn';

// replace all existing classes
btn.className = 'red btn';
}