title: Change the text in a Flip toggle switch, jQuery Mobile
body: <p>I am working on a multilingual iOS/Android app and use a xml file to get my translations. The translation function looks for a i18n-xxx class and replaces the text for html elements with that class with the text from the xml file. </p>
  
  <p>Example:</p>
  
  <p>Html:</p>
  
  <pre><code>&lt;a href="url.html" data-role="button" class="i18n-my-button"&gt;Button&lt;/a&gt;
  </code></pre>
  
  <p>In the xml file:</p>
  
  <pre><code>&lt;translation id="i18n-my-button"&gt;
     &lt;en&gt;Button&lt;/en&gt;
     &lt;sv&gt;Knapp&lt;/sv&gt;
  &lt;/translation&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>...
  $(xml).find("translation").each(function() {
     ...
     var id = $(this).attr("id"); //i18n-my-button
     var translation = $(this).find("sv").text();  //Knapp
     ...
     $("." + id).find("span.ui-btn-text").text(translation);
  });
  </code></pre>
  
  <p>With this approach I am able to translate almost any html element like buttons, radio buttons and check boxes. But I am failing to translate flip toggle switches. </p>
  
  <p>This is how I would like it to be:</p>
  
  <pre><code>&lt;select name="slider" id="flip-a" data-role="slider"&gt;
      &lt;option value="off" class="i18n-off"&gt;Off&lt;/option&gt;
      &lt;option value="on" class="i18n-on"&gt;On&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I want to be able to translate "Off" and "On" to "Av" and "På" using the same function as with the other html elements. The problem is jQuery Mobile translates the simple select to a huge block of code, and I have not yet identified what element I should translate and how to do it. </p>
  
  <p>Any suggestions?</p>