title: dynamically generted html table cannot get selected td value
body: <p>I have looked at <strong>MANY</strong> google and stackoverflow examples</p>
  
  <p>I did create a <strong>fiddle</strong> to demonstrate my problem.</p>
  
  <p><strong>Problem statement. "I want to get the name of the person in the first column upon clicking on their name."</strong>  I have it so on rollover the class for each row highlights in yellow and <strong>I CAN get Jquery to do a click event</strong> and so that works, but when I do this code it spits out all of the text values for every row in that column</p>
  
  <pre><code> $(document).on('click', '.nameField', function () {
          //console.log('t');
          var x = $(".nameField").text();
  
          //var x = $(this).parent(".nameField").text();
          console.log(x);
  
      });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/bthorn/7ck1m7q1/2/" rel="nofollow">http://jsfiddle.net/bthorn/7ck1m7q1/2/</a></p>
  
  <p><strong>More Info.</strong></p>
  
  <p>Click on the button "Fill DIV with Dynamic Table"</p>
  
  <p>Also at the top , notice a STATIC one that on there at the top works to get the name no problem, well there is only one row though</p>
  
  <p><strong>UPDATE  I NEED ALIAS on that row   I created a new class on the td in the alias column,  How can I get at that?</strong></p>
  
  <p><a href="http://jsfiddle.net/bthorn/7ck1m7q1/2/" rel="nofollow">http://jsfiddle.net/bthorn/7ck1m7q1/2/</a></p>