title: How to delete a selected row in a html table by using jQuery?
body: <p>I'm trying to delete a selected row in a table using jQuery.</p>
  
  <p>This is my html markup:</p>
  
  <pre><code>&lt;table id="resultTable"&gt;
   &lt;tr id="first"&gt;
    &lt;td&gt;c1&lt;/td&gt;      
    &lt;td&gt;c2&lt;/td&gt;      
   &lt;/tr&gt;
   &lt;tr id="second"&gt;
    &lt;td&gt;c3&lt;/td&gt;      
    &lt;td&gt;c4&lt;/td&gt;      
    &lt;/tr&gt;    
  &lt;/table&gt;
  &lt;button id="del"&gt;Clear&lt;/button&gt;
  </code></pre>
  
  <p>This is the script I'm using..</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function () {   
       var tid="";   
  
       $('#resultTable tr').click(function (event) {
          tid=$(this).attr('id');
            alert(tid); //trying to alert id of the clicked row   
       });
  
       $("#del").click(function(){
       alert("removing "+ tid);
              $(tid).remove();    
       });
   });
  &lt;/script&gt;
  </code></pre>
  
  <p>I'm declaring a global variable "tid" to obtain "rowId" and using the same variable in both click() function. But I'm unable to delete the corresponding row, please help me </p>