JSFiddle - React, Tailwind, and code Playground
HTML
<div id="status"></div>
<button>random</button>
CSS
#status {
background-color:#CCC;
height:50px;
-webkit-transition: background-color 2000ms linear;
-moz-transition: background-color 2000ms linear;
-o-transition: background-color 2000ms linear;
-ms-transition: background-color 2000ms linear;
transition: background-color 2000ms linear;
}
JavaScript
function randomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1) + min);
}
$('button').click(function () {
if (randomInt(1, 100) > 50) {
$('#status').html("win").css({
backgroundColor: "green"
});
} else {
$('#status').html("lose").css({
backgroundColor: "red"
});
}
})