I'm coding a menu by JQUERY + CSS but when i fill it with data, it doesn't appear as the original one (Without filled data).

Here's my code:

1. <script type="text/javascript" src="../jquery.js"></script>
   <script type="text/javascript" src="../menu.js"></script>
   <link href="../menu.css" rel="stylesheet" type="text/css">
   <div id="menu">
   <ul class="menu">
   <li><a href=#><span>trang chu</span></a></li>
   <?php
   $sql_theloai = "
   SELECT idTL, TenTL 
   FROM theloai 
   WHERE AnHien = 1
   ORDER BY ThuTu ASC";
   $theloai = mysql_query($sql_theloai) or die(mysql_error());
   while($row_theloai = mysql_fetch_assoc($theloai))
   {
   
   ?>
   <li><a class="parent" href=#><span><?php echo $row_theloai['TenTL'];?></span></a>
   <ul>
   <?php
   $sql_loaitin = "
   SELECT idLT, Ten 
   FROM loaitin 
   WHERE idTL = '".$row_theloai['idTL']."' AND AnHien=1 
   ORDER BY ThuTu ASC";
   $loaitin = mysql_query($sql_loaitin) or die(mysql_error());
   while($row_loaitin = mysql_fetch_assoc($loaitin))
   {
   ?>
   <li><a href=#><span><?php echo $row_loaitin['Ten'];?></span></a></li>
   <?php 
   }
   ?>
   </ul>
   </li>
   <?php
   }
   ?>
   
   </ul>
   </div>
   <div id="copyright"><a href="http://apycom.com/"></a></div>
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   

Thanks for helping me :D