javascript - How to select a value of a row in a table with jquery? -

i want value of row in table jquery, when user click on it.

i have tried solution, doesn't work correctly:

$(document).ready(function() {                      $.post("./php/myjson.php", function(data, status) {                      obj = json.parse(data);                      var trhtml = '';                      (var = 0; < obj.giocatori.length; i++) {                            trhtml += '<tr><td><img src="../media/image/squadre/' + obj.giocatori[i].squadra.tolowercase() + '.png"/></td><td>'+obj.giocatori[i].giocatore+'</td><td>' + obj.giocatori[i].cognome + '</td><td>' + obj.giocatori[i].prezzo + '</td></tr>';                      }                      trhtml+='</tbody>';                      $('#records_table').append(trhtml);                    });                  $( "#records_table tr" ).on( "click", function(  ) {                        alert( $(this).find('td:nth-child(2)').html());                  });                });

table tbody tr:hover {      background-color: orange;      cursor: pointer;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <table id="records_table" border="1">            <tbody>              <tr>                  <th>squadra</th>                  <th>id</th>                  <th>cognome</th>                  <th>prezzo</th>                </tr>        </table>

where error ?

even though table exists when page loads, contents loaded after page loads (after dom ready event). want use delegated event. therefore, try this:

$( "#records_table" ).on( "click", "tr", function(  ) {     alert( $('td', this).eq(2).html() ); }); 

note: adding section -- version -- in success call of the ajax call after new content added should work.