title: How do I replace jQueryUI button text?
body: <p>I've got a button that I use with jQueryUI somethink like this (simplified). </p>
  
  <pre><code>&lt;button id="mybutton"&gt;Play&lt;button&gt;
  &lt;script&gt;
  $("#mybutton").button().toggle(
      function(){
         $(this).text('Stop');
      },
      function(){
         $(this).text('Start');
      },
  );
  &lt;/script&gt;
  </code></pre>
  
  <p>This code breaks the way the button looks because when making it into the button widget, there's a new span added inside the button. So I'm changing the button value like this now</p>
  
  <pre><code>$(this).find('span').text('Stop');
  </code></pre>
  
  <p>This is hacky because I can't treat the button as a black box anymore and have to go inside.</p>
  
  <p><strong>Is there a clean way to do this?</strong></p>