While loop using Jquery does not display properly

i am using jquery and it is being called inside a while loop to display the output. the output for the first item is correct but for the second item it is not working properly. here is the code.....

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <title>JSP Page</title>

        <link rel="stylesheet" type="text/css" href="style.css"/>

         <script src="jquery-1.6.4.min.js" type="text/javascript"></script>

     <script type="text/javascript">

     $(document).ready(

     function()

     {

         $("#x").show();

       $("#y").hide();

        //$("$t:eq(1)").hide();

        //$("$t:eq(2)").hide();

         $("#x").click(


             function()

             {

               $("#y").show();

                // $("#t:eq(1)").show();

                 //$("#t:eq(2)").show();

             }

         );

     }

   );

  </script>

    </head>

    <body  bgcolor="#F3F3F3">

        <%

String userid=null;

if(session.getAttribute("visitor")!=null)

{

    userid=(String)session.getAttribute("visitor");

}

else

    {

response.sendRedirect("signin.jsp");

}

        if(request.getParameter("btnlogout")!=null)

    {

if(session.getAttribute("visitor")!=null)

    {

session.setAttribute("visitor",null);

response.sendRedirect("home.jsp");

}

else

    {

response.sendRedirect("pat_welcome.jsp");

}

}

%>

 <div> <%@include file="master.jsp"%></div>


        <div id="body1">

            <br/><br/><br/>

            <div style="margin-left:650px; ">

            <form action="#" method="get"><input type="submit" value="Logout" name="btnlogout" /></form></div>

               <br/><br/> <div id="main">

                    <div> <%@include file="leftdiv.jsp" %></div>

                    <div id="center">

                         <h2 style="color: indianred;">Articles</h2><br/>

<%

String id=null;

String dname=null;

String atitle=null;

String ades=null;

Connection con=null;

Statement smt=null;

ResultSet rs=null;

try

{

Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");

con=DriverManager.getConnection("jdbc:odbc:hcsds");

smt=con.createStatement();

rs=smt.executeQuery("select * from article");

while(rs.next())

{

id=rs.getString(1);

atitle=rs.getString(2);

ades=rs.getString(3);

dname=rs.getString(4);

%>


<div id="x" style="height:50px;width: 300px;">

<table border="0" cellpadding="5" cellspacing="10">

    <tr>

        <td>Title:</td>

        <td><%=atitle%></td>

    </tr>

    <tr>

        <td>Posted by:</td>

        <td><%=dname%></td>

    </tr>

</table>

</div>




<div id="y" style="height:100px; width: 300px;">

<table border="0" cellpadding="5" cellspacing="10">

    <tr>

        <td>Description:</td>

        <td><%=ades%></td>

    </tr>

</table>

</div>


       



<%

}

}

catch(Exception ex)

{

out.println(ex.getMessage());

}

%>


                    </div>

                    <div id="gap"></div></div></div>

        <center><hr size="2px" width="900px" color="gray"/></center>

        <div><%@include file="footer.jsp"%></div>

    </body>

</html>

Edited by Roger, 22 November 2011 - 07:25 AM.
added code tags, updated title, moved to correct forum