JSFiddle - React, Tailwind, and code Playground

by huuzoo

HTML

<div id="target" class="banana white">クラス名の置換</div>
<button onclick="replaceClass();">置換実行</button>

CSS

.banana {
  background-color: yellow;
}
.apple {
  background-color: red;
}
.white {
  color: white;
}

JavaScript

function replaceClass() {
	var target = document.getElementById('target');
	target.classList.replace('banana', 'apple');
}