JSFiddle - React, Tailwind, and code Playground

HTML

<div id="game">  
    <div id="pic1"></div>
    <div id="pic2"></div>
    <div id="pic3"></div>
    <div id="pic4"></div>
    <div id="pic5"></div>

<input type="image" value="Click"  />
<div class="hidden_div"></div>
</div>

CSS

#game {width:520px; height:200px; background:#b1b1b1; border:solid 1px #000;}
#game input {width:120px; height:50px; margin:20px 0 0 180px; border:solid 1px #000000;}

#pic1 { width:90px;
        height:90px; 
        border:solid 1px #000000; 
        display: inline-block; 
        margin:10px 0 0 7px;
        }
#pic2 { width:90px;
        height:90px;  
        border:solid 1px #000000; 
        display: inline-block; 
        margin:10px 0 0 7px;
        }
#pic3 {width:90px;
        height:90px;  
        border:solid 1px #000000; 
        display: inline-block; 
        margin:10px 0 0 7px;
        }
#pic4 { width:90px;
        height:90px; 
        border:solid 1px #000000; 
        display: inline-block; 
        margin:10px 0 0 7px;
        }
#pic5 { width:90px;
        height:90px; 
        border:solid 1px #000000; 
        display: inline-block; 
        margin:10px 0 0 7px;
        }

div.hidden_div {
    background:#b1b1b1;
    margin:15px 0 0 -1px;
    width:520px;
    height:100px;
    display:none;
    position:absolute;
    border-left:solid 1px #000000;
    border-right:solid 1px #000000;
    border-bottom:solid 1px #000000;
}

JavaScript

$(document).ready(function() {
    $(":image").click(function() {
        $("div.hidden_div").slideToggle(300);
    });
});