I've got a button that I use with jQueryUI somethink like this (simplified).

<button id="mybutton">Play<button>
<script>
$("#mybutton").button().toggle(
    function(){
       $(this).text('Stop');
    },
    function(){
       $(this).text('Start');
    },
);
</script>

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

$(this).find('span').text('Stop');

This is hacky because I can't treat the button as a black box anymore and have to go inside.

Is there a clean way to do this?