title: Get element attribute with .each loop
body: <p>I have a simple example table that has data attributes for every table row. </p>
  
  <pre><code>&lt;table id="example"&gt;
    &lt;tr data-sample="1"&gt;
      &lt;th&gt;Fox&lt;/th&gt;
      &lt;th&gt;Sam&lt;/th&gt;
      &lt;th&gt;Ted&lt;/th&gt;
    &lt;/tr&gt;
    &lt;tr data-sample="2"&gt;
      &lt;td&gt;Bill&lt;/td&gt;
      &lt;td&gt;Nick&lt;/td&gt;
      &lt;td&gt;Pal&lt;/td&gt;
    &lt;/tr&gt;
    &lt;tr data-sample="3"&gt;
      &lt;td&gt;El&lt;/td&gt;
      &lt;td&gt;Pal&lt;/td&gt;
      &lt;td&gt;Tea&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I'm trying to get all <code>data-sample</code> attributes with the following code:</p>
  
  <pre><code>('#example tr').each(function () {
      console.log(this.data('sample'));
  });
  </code></pre>
  
  <p><a href="https://jsfiddle.net/wkxwkro4/" rel="nofollow noreferrer">JSfiddle</a></p>
  
  <p>And I'm getting a "this.data is not a function" error. This gets me to the point that in .each jquery loop <code>this</code> returns a DOM element, not a function or whatever I can use a a selector (if I just print out <code>this</code>, I get a list of table rows and their children). Is there any way to get <code>this</code> as a selector? <code>('#example').children('tr')</code> and <code>('#example').find('tr')</code> give the same result.</p>