title: jQuery Mobile <select> produces extra 'ui-btn-text'
body: <p>I have the below code</p>
  
  <pre><code>&lt;select id="country"&gt;
      &lt;option value="1"&gt;Atlanta&lt;/option&gt;
      &lt;option value="2"&gt;Berlin&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>but it seems to be generating the below markup</p>
  
  <pre><code>&lt;div class="ui-select"&gt;&lt;div data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-d" data-iconpos="right" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-icon-right ui-btn-up-c"&gt;&lt;span class="ui-btn-inner ui-btn-corner-all"&gt;&lt;span class="ui-btn-text"&gt;&lt;span&gt;Atlanta&lt;/span&gt;&lt;/span&gt;&lt;span class="ui-icon ui-icon-arrow-d ui-icon-shadow"&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;
  &lt;select id="country"&gt;
      &lt;option value="1"&gt;Atlanta&lt;/option&gt;
      &lt;option value="2"&gt;Berlin&lt;/option&gt;
  &lt;/select&gt;
  &lt;/div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and the problem with this is that it is producing an extra span with my selected text in front of the dropdown list. How do I remove that span with selected text?</p>