JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div class="row">
	<div class="col-lg-2 main-menu">
		<ul data-role="mainMenu" id="mainMenu">
			<li>
				Submenu 1
				<ul>
					<li>
						<a href="#">Item1</a>
					</li>
					<li>
						<a href="#">Item 2</a>
					</li>
				</ul>
			</li>
			<li class="k-state-active">
				Submenu 2
				<ul>
					<li>
						<a href="#">Item1</a>
					</li>
					<li>
						<a href="#" class="k-state-selected">Item2</a>
					</li>
					<li>
						<a href="#">Item 3</a>
					</li>
					<li>
						<a href="#">Item4</a>
					</li>
					<li>
						<a href="#">Item5</a>
					</li>
					<li>
						<a href="#">Item6</a>
					</li>
					<li>
						<a href="#">Item7</a>
					</li>
					<li>
						<a href="#">Item8</a>
					</li>
					<li>
						<a href="#">Item9</a>
					</li>
					<li>
						<a href="#">Item10</a>
					</li>
				</ul>
			</li>
		</ul>
	</div>
	<div class="col-lg-10">
		<table class="table">
			<thead>
			<tr>
				<th colspan="5">Titel</th>
			</tr>
			</thead>
			<tbody>
			<tr>
				<td>Data</td>
				<td>
					Data 2
				</td>
				<td>
					Data 3
				</td>
				<td>Data 4</td>
				<td>
					Data 5
				</td>
			</tr>
			<tr>
				<th colspan="5">Title 2</th>
			</tr>
			<tr>
				<td>Col 1</td>
				<td>
					Col 2
				</td>
				<td>
					Col 3
				</td>
				<td>Col 4</td>
				<td>
					Col 5
				</td>
			</tr>
			<tr>
				<td>Col 1</td>
				<td>
					Col 2
				</td>
				<td>
					Col 3
				</td>
				<td>Col 4</td>
				<td>
					Col 5
				</td>
			</tr>
			</tbody>
		</table>
	</div>
</div>

JavaScript

$('#mainMenu').kendoPanelBar();