JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<div style="text-align: left;" id="tabd">
<ul id="tabbox">
<li><a href="#tab1" class="content active" id="menu1"><img src="../images/tab_cam1_on.png" alt="" /></a></li>
<li><a href="#tab2" class="content" id="menu2"><img src="../images/tab_cam2_off.png" alt="" /></a></li>
<li><a href="#tab3" class="content" id="menu3"><img src="../images/tab_preset_off.png" alt="" /></a></li>
</ul>
<div id="tab1" class="tab">
<!-- カメラ制御1 -->
<table cellspacing="0" cellpadding="0" style="border: 0px;">
<tr>
<td colspan="5" style="height: 223px; background-image: url(../images/cam_stage_off.png);">
<table cellspacing="0" cellpadding="0" style="border: 0px;">
<tr>
<td colspan="6" style="width: 440px; height: 30px;">
<div style="text-align: left;">
<table cellspacing="0" cellpadding="0" style="border: 0px; background-image: url(../images/cam_stage_off.png);">
<tr>
<td style="width: 10px; height: 24px;"></td>
<td style="width: 25px; text-align: left; vertical-align: bottom;"><img src="../images/icon_point.png" alt="" /></td>
<td style="width: 405px; text-align: left; vertical-align: bottom;">
<input name="CamStatus" type="text" id="CamStatus" readonly="readonly" style="width: 396px; height: 16px; background-color: #263C58; color: white; line-height: 16px;" />
</td>
</tr>
...
JavaScript
$(function () {
$("#tabd").tabs();
});