title: How can I add a table row using an onclick event in a td
body: <p>Okay, so I have it dropping down another  under a username when clicked on, showing the name, email, etc for that user, but it's dropping down the user info for each user under each user name, instead of just below the one I clicked on. </p>
  
  <p>Is there a way to tell it to show the next  element only, instead of all the hidden ones?</p>
  
  <p>I've tried grabbing the index of the  clicked on (the one with the user name, but I can't seem to get a function to work using any type of index+1 type logic. </p>
  
  <p>Here's the code I have now:</p>
  
  <pre><code>&lt;?php
    for ($output_user = 0; $output_user &lt;= $num_pending - 1; $output_user++)
    {
      echo "\n\t&lt;tr class=\"pending_users\"&gt;\n\t\t&lt;td class=\"admin\"&gt;".$pending_user[$output_user][0]."&lt;/td&gt;";
      echo "\n\t\t&lt;td class=\"m_1\"&gt;&lt;input type=\"checkbox\" value=\"approve\"/&gt;&lt;/td&gt;";
      echo "\n\t\t&lt;td class=\"m_l\"&gt;&lt;input type=\"checkbox\" value=\"deny\"/&gt;&lt;/td&gt;";
      echo "\n\t&lt;/tr&gt;";
      echo "\n\t&lt;tr class=\"showhide\"&gt;\n\t\t&lt;td class=\"admin\" colspan=\"3\"&gt;Name:".$pending_user[$output_user][1]." ".$pending_user[$output_user][2]."\nEmail: ".$pending_user[$output_user][3]."\nEnrol Date: ".$pending_user[$output_user][4]."&lt;/td&gt;\n\t&lt;/tr&gt;";
      echo "\n\t&lt;/tr&gt;";
    }
  ?&gt;
  &lt;script&gt;
   $(document).ready(function() {
    //Hides specific user details when the page loads
    $("div.show_user_info tr.showhide:visible").hide();
  
    //Makes every other row another bgcolor - effects pending user table only
    $("tr.pending_users:odd").css("background-color", "#ffff00");
   });
  
   $("td.admin").click(function () {
    var nextIndex = $("tr").index(this) + 1;
    $("div.show_user_info tr.showhide:hidden").slideDown("slow");
   });
  
   $("tr.showhide").click(function () {
  
    $(this).slideUp("slow");          
   });
  &lt;/script&gt;
  </code></pre>
  
  <hr>
  
  <p>The page I'm working on is an admin page where the user can approve or deny registration requests. I'm using php to dynamically create a table row for each user in a database that's pending registration. </p>
  
  <p>That being said, when the user clicks on the  that the users username is in, I want to insert a + that will show that users info (name, request date, etc), and that will disappear when the user clicks on another  with another username on it, and have it display another row, etc for that user. </p>
  
  <p>The php I'm using to create the table rows is this:</p>
  
  <pre><code>&lt;?php
      for ($output_user = 0; $output_user &lt;= $num_pending - 1; $output_user++)
      {
          echo "\n\t&lt;tr&gt;\n\t\t&lt;td class=\"admin\"&gt;".$pending_user[$output_user][0]."&lt;/td&gt;";
          echo "\n\t\t&lt;td class=\"m_1\"&gt;&lt;input type=\"checkbox\" value=\"approve\"/&gt;&lt;/td&gt;";
          echo "\n\t\t&lt;td class=\"m_l\"&gt;&lt;input type=\"checkbox\" value=\"deny\"/&gt;&lt;/td&gt;";
          echo "\n\t&lt;/tr&gt;";
      }
  ?&gt;
  </code></pre>
  
  <p>Can I create an onclick event that does this using php, or would I need to use javascript? I've been all over the internets looking for examples of something similar, and I can't find anything helpful.</p>