Multiple tr in a tbody

Hi, I have this table which gets its data from my sql database. I run a jquery function to enable users to view row details upon clicking on an icon. I have 2 <tr> inside my <tbody>. I had given my row details <tr> a class of its own so that the jquery function can call it out. Right now, Data tables isn't showing up.

This is my code:

<div id="wrapper">
<form name="myForm" onsubmit="return onSubmitform();" method="post" enctype="multipart/form-data">
<fieldset>

<table id= "table_id" class="display">

<thead>

<tr>
<th>Details</th>
<th>Id</th>
<th>Name</th>
<th>Address</th>
<th>Shipped</th>
</tr>
</thead>

  <tbody>
  <?php 
while ($row = mysqli_fetch_array($result)) {
?>
<tr>
    <td>
	<img src="details_open.png" name="detailsButton" class="detailsButton">
	</td>
    <td> 
	<input type="submit" class="formbutton" onclick="document.pressed=this.value" name='pdf[<?=$row['id']?>]' value="">
	<input type="text" value='<?=$row['id']?>' name="id" id="order_id" style="border:none">
	</td>
	<td width="20%"><?=$row['name']?></td>
	<td width="30%"><?=$row['address']?></td>
	<td class="shipped" width="10%">
	<input type="checkbox" name='shipped[<?=$row['id']?>]' value="S">
	</td>
	</tr>
	
	<tr class="detailsRow">
	<td colspan="5"><table class="bordered" id="inner_table" cellpadding="10" cellspacing="0" border="1"><thead><tr><th>Item Id</th><th>Item Description</th><th>Quantity</th><th>Price</th></tr></thead><tbody><tr><td>1</td><td><?=$row['product']?></td><td><?=$row['quantity']?></td><td><?=$row['price']?></td></tbody></table></td>
	</tr>
<?php
}
?>
</tbody>
</table>
</fieldset>

<fieldset>
<table>
<tr>
<td><input type="submit" onclick="document.pressed=this.value" value="Update"> </td>
</tr>
</table>
</fieldset>
</form>
</div>

Thanks!