show hide div

show hide div

Hi experts,

I am learning JQuery, wrote this code but not working, please help.


<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<script type="text/javascript" src="jquery-latest.js"></script>
<style type="text/css">
.showed{display:none);
</style>

<script type="text/javascript">
$(document).ready(function() {
$("#play").click(function() {
$(".showed").show();
$(this).next().hide();
}):
}):
</script>
</head>

<body>

<table border="1" cellpadding="0" style="border-collapse: collapse" width="100%" id="table1">
      <tr>
         <td>a
         <div class="showed">Show this div</div></td>
         <td>
         <p align="center">
   <input type="image" src="../../../pashto/play.jpg" width="14" height="14" id="play" name="I1"></td>
         <td>c</td>
      </tr>
      <tr>
         <td>x
         <div class="showed">Show this div</div>         </td>
         <td>
         <p align="center">
         <input type="image" src="../../../pashto/play.jpg" width="14" height="14" id="play" name="I2"></td>
         <td>z</td>
      </tr>
      <tr>
         <td>&nbsp;</td>
         <td>&nbsp;</td>
         <td>&nbsp;</td>
      </tr>
   </table>


</body>

</html>