Jquery Content Tab in Table

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {

    //When page loads...
    $("div.tab_content").hide(); //Hide all content
    $("table.affiliate_table td a#check:first").addClass("active").show(); //Activate first tab
    $("div.tab_content:first").show(); //Show first tab content

    //On Click Event
    $("table.affiliate_table td#nav a#check").click(function() {

        $("table.affiliate_table td a#check").removeClass("active"); //Remove any "active" class
        $(this).addClass("active"); //Add "active" class to selected tab
        $("div.tab_content").hide(); //Hide all tab content

        var activeTab = $(this).attr("href"); //Find the href attribute value to identify the active tab + content
        $(activeTab).fadeIn(); //Fade in the active ID content
        return false;
    });

});
</script>

<style type="text/css">

html table.affiliate_table1 td#nav a#check.active { 
 background:#ccc; 
}

 .tab_container {
 border: 1px solid #999;
 border-top: none;
 overflow: hidden;
 clear: both;
 float: left; width: 100%;
 background: #fff;
}
.tab_content {
 padding: 20px;
 font-size: 1.2em;
}
</style>

<table width="100%"  class="affiliate_table">

<tr> 

<td id="nav"><a id="check" href="#tab1">View</a>&nbsp;/&nbsp; 

<a href="http://www.google.co.in/">Edit</a></td>

<tr> 

</table>

<div class="tab_content"  id="tab1">
  <table width="100%" border="0"  class="affiliate_table">
  <tr>
   <td width="23%"><strong>Name</strong></td>
   <td width="77%">Test</td>
  </tr>

</table>

</div>