Good afternoon, I have a table that is displayed for a list of objects (each object is 1 line).

<table id="criterionTable" class="table table-condensed table-hover table-responsive"> <thead class="table-head"> <tr> <th>name</th> <th>add</th> </tr> </thead> <tbody id="criteriaTableId"> </tbody> </table> function appendTableRows(data){ $.each(data, function(key, value){ $('#criterionTable > tbody:last-child').append("<tr>" + "<td>"+value.title+"</td>" + "<td><button class='addButton btn-primary btn-sm'><span class='glyphicon glyphicon-plus'></span></button></td>" + "</tr>"); }); }

I want that when I click on any of the buttons in the second column, I get the value corresponding to it from the first (name).

wrote such a script, but it does not work:

  $('.addButton').click(function () { console.log($(this < 'tr:first').text()); });

Please tell me how to fix it. Thank.

    1 answer 1

     $(document).on('click', '.addButton', function () { console.log($(this).closest('tr').find('td:first').text()); });

    jsfiddle

    • Stanislav Grotto, not working .. - Aleksei
    • .text () highlights as Unresolved function or method text, and displays nothing to the console - Aleksei
    • @Aleksei code works, you can check on jsfiddle, 'Unresolved function or method text' most likely you write phpStorm. - Stanislav Grot
    • I fixed a problem with the unresolved function, but still nothing is output to the console. I have this table filled out separately from the view in jquery, Maybe this is the problem? Added on first post - Aleksei
    • @Aleksei changed the answer, now designed for dynamic addition - Stanislav Grot