JSFiddle - React, Tailwind, and code Playground

HTML

<div id="ONE">one</div>
<div id="f-ONE">f-one</div>

<div class="start">start</div>

CSS

#ONE{background: #f70a58; position: absolute; width: 100px; height: 100px; left: 0px; top: 0px; display: none;}

#f-ONE{background: #f4f70a; position: absolute; width: 100px; height: 100px; left: 0px; top: 100px; display: none;}

.start{background: #f7630a; position: absolute; width: 50px; height: 50px; top: 250px;}

JavaScript

var myArray = [],  ran;

myArray[0] = "ONE"; 
myArray[1] = "f-ONE"; 

//function getRandom to choose a random element from array 

function getRandom(array, getVal) { 
var key = Math.floor(Math.random() * array.length); 
if (getVal) { 
    return array[key]; 
     }
    return key; 
        }


        $(".start").click(function() { 

   ran = getRandom(myArray, true).toLowerCase();  
            
    if(ran === 'f-one'){ 
      $('#f-ONE').show();
              } else { 
                  $('#ONE').show(); 
                  }
            
          });