JSFiddle - React, Tailwind, and code Playground

HTML

<button type="button" class="btn-black" id="btn-blue"> <span id="pouce"></span> Liked</button>

CSS

.btn-blue {

    width: 110;
    height: 36px;
    cursor: pointer;
    border: none;
    background-color: #E9F3FE;
    color: #0572EF;
    font-size: 17px;
    border-radius: 8px;
    outline: none;
}

.btn-black {

  width: 110;
  height: 36px;
  cursor: pointer;
  border: none;
  background-color: #E5E6EB;
  color: #000000;
  font-size: 17px;
  border-radius: 8px;
  outline: none;
}

JavaScript

const btn = document.getElementById('btn-blue')
btn.addEventListener('click', () => {
	if (btn.classList.contains('btn-black')) {
  	btn.classList.replace('btn-black', 'btn-blue')
  } else {
  	btn.classList.replace('btn-blue', 'btn-black')
	}
})