JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" type="text/css" href="css/main.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<body>
<div id="left" onclick=></div>
<div id="right"></div>

CSS

html,body {
	padding:0;
	margin:0;
	height:100%;
	min-height:100%;
	background-color: #000000;
}
p { 
	cursor: pointer;
	color: #FFF;
}
#left {
	width: 50%;
	height: 100%;
	background: #666;
	float: left;
	cursor: pointer;
    position: absolute;
}
#right {
	width: 50%;
	height: 100%;
	background: #063;
	float: right;
	cursor: pointer;	
}

JavaScript

$('#left').click(function(){
	$('#left').animate({width:'100%'}, 2500);
});




$('#right').click(function(){
	$('#right').animate({width:'100%'}, 2500);
});