JSFiddle - React, Tailwind, and code Playground

HTML

<div class="card"></div>
<div class="card"></div>
<div class="card"></div>
<div class="card"></div>

<button id="play">Play !</button>

CSS

.card {
  height: 50px;
  width: 50px;
  background-color: red;
  margin: 5px;
}

div {
  display: none;
}

JavaScript

/*
$(document).ready(function() {
	$('#play').click(function() {
    var card = $('.card').get(Math.round(Math.random() * 3));
    $(card).show();
  });
});
*/

(function() {
	
  var cards = document.getElementsByClassName('card');
  
  var play = document.getElementById('play');
  
  play.addEventListener('click', function() {
  	cards[Math.round(Math.random() * 3)].style.display = 'block';
  });
  
})();