Clickable jquery table rows

Question

I generate a table on a page like so:

<table id="documents" class="table-striped">
    <thead>
    <tr>
        <th>File Name::</th>
        <th>Date Uploaded</th>
    </tr>
    </thead>
    {{#each Documents}}
        <tr id="{{Name}}">
            <td id="name" name="name">{{Name}}</td>
            <td id="date" name="date">{{Date}}</td>
        </tr>
    {{/each}}
</table>

using handlebars And using jquery i make the table row clickable like so:

$(function(){
        $( "#documents tr" ).click(function() {
            var name = $(this).find('td:eq(0)').html;
            alert(name);
        });
});

And im trying to display the value from the #name table data. However it keeps giving me undefined, and i can't figure out how to get the data from the selected table row and the name table data object.

Answer 1

.html() is a method not property hence you must invoke it by having parenthesis[()]

Change

var name = $(this).find('td:eq(0)').html;

to

var name = $(this).find('td:eq(0)').html();

But If you want to get text of the element, Use .text() instead.