JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!doctype html>


    <title>Button Show</title>

  <body>
   
<body>
   
    <button id="show" type="button" class="btn btn-primary">Click Me!</button> 
    <button id="hide" type="button" class="btn btn-primary">Hide Me Now!</button> 

    <div id="one">1</div>
    <div id="two">2</div>
    <div id="three">3</div>

    <script src="javascript.js"></script>  
  </body>
</html>

CSS

div {
    margin: 3px;
    width: 80px;
    display: none;
    height: 80px;
    float: left;
  }
  #one {
    background: #f00;
  }
  #two {
    background: #0f0;
  }
  #three {
    background: #00f;
  }

JavaScript

$(document).ready(function (){
	$('#show').click(function(){
		$( "div:hidden:first" ).fadeIn( "slow" );
	});
	$('#hide').click(function(){
		$( "div" ).fadeOut("fast");
	});
});