title: Semantic UI Dropdown Option Data Attribute
body: <p>I've been trying to attach a <code>data-*</code> attribute in a Semantic UI dropdown <code>option</code> but to no success <em>(the data attributes are not being copied to the resulting dropdown options)</em>.</p>
  
  <p>Here's the structure of my <code>select</code>:</p>
  
  <h3>HTML</h3>
  
  <pre><code>&lt;select id='my-dropdown' name='department'&gt;
      &lt;option value='1' data-wsg='something'&gt;Department 1&lt;/option&gt;
      &lt;option value='2' data-wsg='another'&gt;Department 2&lt;/option&gt;
      . . .
      &lt;option value='n' data-wsg='custom data'&gt;Department N&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <h3>jQuery</h3>
  
  <pre><code>$("#my-dropdown").dropdown({
      allowAdditions: false,
      fullTextSearch: true,
      onHide: function() {
          // Some codes.
      },
      onChange: function(value, text, choice) {
          // Access the data-wsg attribute of the selected option.
      }
  });
  </code></pre>
  
  <p>I've been reading around a bit but all I saw regarding data attribute support was storing the settings in there. Not really what I need.</p>
  
  <p>Hopefully someone has done something similar and let me know what the solution is.</p>