how to get the value of tr of a table using jquery on click

Question

I have an example table

<table class="table">
  <tr value="1" class="side-link">
    <td>one</td>
    <td>two</td>
  </tr>
 <tr value="2" class="side-link">
    <td>one</td>
    <td>two</td>
  </tr>
</table>

I want to get the value of the selected tr on click function. what I've tried so far

$(".table").on('click','.side-link',function(e){
    e.preventDefault();
    var id = $(this).attr('value');
    alert(id);
}); 

the problem is I cannot address this to the respective "tr" I click , instead it gets the value of .table. Can anyone solve the issue here? I would be really grateful! THanks :)

Note: it needs ( on click ) because I've to replace tr using ajax and the new elements wont be recognized by just using click function !!

Jquery version 1.9.1

Answer 1

$(".table").on('click','tr',function(e){
    e.preventDefault();
    var id = $(this).attr('value');
    alert(id);
}); 

JSFiddle