JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>


<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/prettify.css" rel="stylesheet">
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jqueryui.js"></script>
<script type="text/javascript" src="scripts/owl.carousel.min.js"></script>
<script type="text/javascript" src="scripts/jquery.swipebox.js"></script>
<script type="text/javascript" src="scripts/colorbox.js"></script>
<script type="text/javascript" src="scripts/snap.js"></script>
<script type="text/javascript" src="scripts/contact.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<script type="text/javascript" src="scripts/framework.js"></script>
<script type="text/javascript" src="scripts/framework.launcher.js"></script>
<script src="js/jeditable.mini.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.2.17.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js" charset="utf-8"></script>


</head>

<body>

	<!--Drop down filter box that should show each option returned from functions below-->

	<form>
		<select name="huge" class="btn-group select select-block mbl select-multiple" id="select#FriendsConnected">
			<option value="0">Filter Friends/Requests</option>
		</select>

		<button id="FriendsConnected" type="button" class="button button-magenta">Connected Friends</button>
		<button id="FriendsPending" type="button" class="button button-orange">Friend Requests</button>
	</form>

	<!--Displays content/images on page after filter-->
	<div id="container">
		<div id="userimgs" class="responsive-image"></div>
	</div>
	<div id="containerFriendsPending"></div>
	<div id="containerFriendsConnected"></div>
	<div id="container">
		<div id="badgeimgs"></div>
	</div>


	<script...