Multiple Show and Hide using a MYSQL Fetch Array?

Multiple Show and Hide using a MYSQL Fetch Array?

Here is the code

function wall_home()
{
global $ir,$c,$userid,$h;
$wall=mysql_query("SELECT * FROM wall",$c) or die(mysql_error());
print "<table width=100% class=forumline>
<th colspan=4>The Wall</th><tr>
<td colspan=2 align=center><a href=thewall.php?action=post>Make A Post</a></td><tr>
<th width=30%>Poster</th><th width=70%>Post</th><th>Action</th><tr>";
while($wa=mysql_fetch_array($wall))
{
$user=mysql_query("SELECT * FROM users where userid={$wa['wallUSERID']}",$c) or die(mysql_error());
$wu=mysql_fetch_array($user);
$wazz=mysql_query("SELECT * FROM wallcomments WHERE wcWALL={$wa['wallID']}",$c) or die(mysql_error());
$num=mysql_num_rows($wazz);
print"<td><a href=viewuser.php?u={$wu['userid']}>{$wu['username']}</a></td>
<td>{$wa['wallTEXT']}</td><tr><td></td><td>
<style>
  div { background:#def3ca; margin:3px; width:80px;
  display:none; float:left; text-align:center; }
  </style>
  <script src='jquery.js'></script>
 
  <button id='showr'>Show</button>
  <button id='hidr'>Hide</button>
<div>Comment</br></div>
<script>
$('#showr').click(function () {
  $('div:eq(0)').show('slow', function () {
    $(this).next('div').show('slow', arguments.callee);
  });
});
$('#hidr').click(function () {
  $('div').hide(3000);
});

</script>
</td>";
if($wa['wallUSERID'] == $userid || $ir['user_level'] != 1)
{
print"<td width=40%><a href=thewall.php?action=delete&post={$wa['wallID']}>Delete Post</a></td>";
}
print"</tr>

<td><hr></td><td><hr></td><td><hr></td></tr>";
}
print"</table>";
}


This is my first ever attempt at all so any help is great.

My problem is simply that i have say 5 columns in the database placing the jquery script in that section allows that to be on each and every post. That works fine. the problem is though only the first one works the rest do not. It simply just doesn't have any action while the first one works fine. This is testing so any help is great. Thanks!