Javascript Variables - undefined
<p>Why when I click on a table row, does it alert that row data-attribute as "undefined"?</p>

<pre><code>$(document).on('click', 'tr', function() {

    alert($(this).data("recordId"))

});
</code></pre>

<p>Here is the PHP which (successfully) passes the variable of <code>fee_source_id</code> into the table row as the data-attribute</p>

<pre><code>&lt;table = "all_aifs"&gt;
&lt;tr&gt;
    &lt;th&gt;&lt;b&gt;Document ID&lt;/b&gt;&lt;/th&gt;
    &lt;th&gt;&lt;b&gt;Pubco Name&lt;/b&gt;&lt;/th&gt;
    &lt;th&gt;&lt;b&gt;Filing Date&lt;/b&gt;&lt;/th&gt;
    &lt;th&gt;&lt;b&gt;PDF&lt;/b&gt;&lt;/th&gt;
&lt;/tr&gt;
&lt;?php foreach($result as $index =&gt; $row) : ?&gt;
&lt;tr data-recordId="&lt;?=$row[fee_source_id];?&gt;"
    class="&lt;?=$row["match"] ? "match" : "";?&gt;"&gt;
    &lt;td&gt;&lt;?php echo $row[fee_source_id]; ?&gt;&lt;/td&gt;
    &lt;td&gt;&lt;?php echo $row[company_name_per_sedar]; ?&gt;&lt;/td&gt;
    &lt;td&gt;&lt;?php echo $row[document_filing_date]; ?&gt;&lt;/td&gt;
    &lt;td&gt;&lt;/td&gt;
&lt;/tr&gt;
</code></pre>

<p><strong>UPDATE</strong>
Thanks to the comments below, I discovered there was a few errors in the JavaScript code above, as follows:</p>

<ol>
<li>the alert method was calling the <code>data</code> element instead of the <code>attr</code> element.</li>
<li>the parameters for the <code>attr</code> method were changed to <code>("data-recordId")</code>. (Note: jQuery knows to ignore the first part of this parameter, and so, the <code>data-</code> was not included as a parameter.)</li>
<li>there was a missing semi-colon at the end of the alert method</li>
</ol>

<h2>Updated jQuery (this now works)</h2>

<pre><code>$(document).on('click', 'tr', function() {

    alert($(this).attr("data-recordID"));

});
</code></pre>

<p><strong>QUESTIONS</strong>:</p>

<ul>
<li>I am using jQuery 1.7.2 which supports the <code>$.on()</code> and should also support the <code>.data()</code> and so, should my original positng which uses the <code>.data()</code> method still work? Why is it not working?</li>
<li>Instead of setting the data-attribute to be "x", since it is exactly equal to the first column of each row in the table, (<code>fee_source_id</code>) could I just use the first column/cell in each row of the table instead of the data-attribute which has been passed, to make reference to that record?</li>
</ul>
