title: Find All Data Attributes on a Single Element
body: <p>Anyone know a quick and efficient way to grab all the data attributes from a single element? I realize that jQuerys .data() will do just that, however it will not give me data attributes set using .attr() UNLESS I first select the data attribute using .data(); Also, you can't select elements by data attributes that were added using .data(), which seems silly.</p>
  
  <p>html</p>
  
  <pre><code>&lt;div data-foo="bar"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>javascript</p>
  
  <pre><code>$("div").data();
  //returns {foo:bar} good :)
  
  $("div").attr("data-hello","world");
  $("div").data()
  //returns {foo:bar} no good :(
  
  $("div[data-hello]");
  //returns the div, all good :)
  
  $("div").data("find","me");
  $("div[data-find]");
  //returns nothing, very bad
  </code></pre>
  
  <p>Hopefully this explains</p>