title: jquery get HTML 5 Data Attributes with hyphens and Case Sensitivity
body: <p>How to get data attributes using jquery <a href="http://api.jquery.com/data/" rel="noreferrer"><code>.data()</code></a>? In which case html5 <code>data-*</code> attributes converts to lowercase and camelcase? What are all the main rules to follow while using custom attributes to store data?</p>
  
  <pre><code>&lt;input type="button" class="myButton" value="click me" data-productId="abc"/&gt;
  &lt;input type="button" class="myButton" value="click me" data-product-id="abc"/&gt;
  &lt;input type="button" class="myButton" value="click me" data-PRODUCT-ID="abc"/&gt;
  &lt;input type="button" class="myButton" value="click me" data-ProDUctId="abc"/&gt;
  </code></pre>