JSFiddle - React, Tailwind, and code Playground
HTML
------static:------
<div id="1" >button A</div>
------live:------
<div id="2" onClick="btnswap2(this.id)">button B</div>
<div id="3" onClick="btnswap2(this.id)">button C</div>
<div id="4" onClick="btnswap2(this.id)">button D</div>
<script type="text/javascript">
function btnswap2(id){
var temp = document.getElementById("1").innerHTML;
var clicked_label = document.getElementById(id).innerHTML;
document.getElementById("1").innerHTML = clicked_label;
document.getElementById(id).innerHTML = temp;
}
</script>
CSS
#2,#3,#4{
cursor:pointer;
}