title: Targeting data attributes
body: <p>I have a handful of buttons, and they are inside a couple divs like so:</p>
  
  <pre><code>&lt;div id="inventory"&gt;
    &lt;div&gt;
       &lt;button data-amount="1"&gt;Buy 1 @ $0.30&lt;/button&gt;
       &lt;button data-amount="4"&gt;Buy 4 @ $1.00&lt;/button&gt;
       &lt;button data-amount="30"&gt;Buy 30 @ $6.00&lt;/button&gt;
       &lt;button data-amount="140"&gt;Buy 140 @ $21.00&lt;/button&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div id="product"&gt;
    &lt;div&gt;                 
      &lt;button data-amount="1"&gt;1&lt;/button&gt;
      &lt;button data-amount="10"&gt;10&lt;/button&gt;
      &lt;button data-amount="all"&gt;All&lt;/button&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is, is that most of the examples I've found on how to use this data attribute, has used something like this to target them.</p>
  
  <pre><code>$( "div" ).data( "amount" ) === "stuff";
  </code></pre>
  
  <p>My buttons are in different divs but are both using 'data-amount' I wanted to know if there was a way for me to instead of targeting divs in general, target the highest parent div for these buttons and retrieve the data values accordingly.</p>