Question

Sample Code

`<table>  
    <tr>    
<td> first column </td>    
</tr>  
<tr id ="addRow">   
<td><input type="button" id="add_button" name="add" value="Add" /></td>   
</tr>   
 </table>
`

Now when i click this Add button it should add tr before this row i.e

`<table>  
<tr>   
 <td> first column </td>    
</tr>  
<tr>    
 <td> some content </td>     
</tr> 
<tr id ="addRow">   
<td><input type="button" id="add_button" name="add" value="Add" />   
</td>    
</tr>   
 </table>
`

so the next time i click Add button it has to be

`<table>   
<tr>  
 <td> first column </td>   
 </tr>  
<tr>   
<td> some content </td>  
 </tr> 
<tr>   
<td> some content </td>    
</tr>
<tr id ="addRow">   
<td><input type="button" id="add_button" name="add" value="Add" /> </td>   
</tr>   
 </table>
`

How is this done?? Please help

Answer 1

$(function () {
$('#add_button').click(function () {
    $('<tr><td>Some content</td></tr>').insertBefore('#addRow');

});

}):