JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" id="projs" value="Some Projects" style="border:none;border: 2px solid #e7e7e7;"></input>
	<div id="projList" style="width:100%;position:absolute;bottom:0;" class="hideAway">	
	<table style="margin:0px;width:100%;padding:0px;">
		<tr>
			<td bgcolor="#EA664A" align="center" height="75" width="75">
			</td>
			<td bgcolor="#D8B90C" align="center" height="75" width="75">
			</td>
		</tr>
		<tr>
			<td bgcolor="#0CD836" align="center" height="75" width="75">
			</td>
			<td bgcolor="#1AD8E3" align="center" height="75" width="75">
			</td>
		</tr>
	</table>	
	</div>

CSS

.hideAway {
    visibility:hidden;
}

JavaScript

$(document).ready(function(){

$("#projs").click(function(){
			if($("#projList").hasClass('hideAway'))
			{
				$("#projList").removeClass('hideAway').animate({bottom: '25%'});
			}
			else
			{			
				$("#projList").animate({bottom: '0'}).addClass('hideAway'); //.addClass('hideAway');
			}
			
			});
					

		});