title: Best place for HTML5 data-value attribute?
body: <p>I have the following HTML:</p>
  
  <pre><code>&lt;ul class='dropSelect'&gt;
      &lt;li data-value="one"&gt;
          &lt;span&gt;Menu1&lt;/span&gt;
      &lt;/li&gt;
      &lt;li data-value="two"&gt;
          &lt;span&gt;Menu2&lt;/span&gt;
      &lt;/li&gt;
      &lt;li data-value="three"&gt;
          &lt;span&gt;Menu3&lt;/span&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>My question is: is it better practice to place the data-value attribute on the span next to the actual menu item text or is it just as good to place on the parent <code>li</code> element as I have done?  This attribute will receive data from a web service and I'm using some js to grab the value of this attribute and placing it inside of another element on the page.</p>
  
  <p>SOF warned me upon posting this question that it might be too subjective ... and it might be ... but my concern is to understand what, if any, impact my placement of this attribute may have on UI engineering, javascript DOM manipulation, accessibility, etc.</p>