button behavior

button behavior

I'm new to jQuery but stuck so appreciate any tips.

I create a button which opens a dialog.
1. Using Start Theme, the button is dark blue, then light blue on hover, and green on click.  On click the dialog opens but after the dialog closes the button does not return to dark blue, it stays in the hover state.  Why?
2. Why doesn't the icon go next to the text on the button by default instead of above?  Must I create a specific style for the button to fix the layout?


   <script type="text/javascript">
   $(function(){
       $('#dialog').dialog({
               autoOpen: false,
           width: 600,
       });
       $('#vb').button();
       $('#vb').click(function() {
               $('#dialog').dialog('open').load('/cgi-bin/test.pl','qstr');
           return false;
       })
   });
   </script>

 </head>

 <body>
   <div id="dialog" title="Audio Matching"></div>

   <button id=vb class="vbutton  ui-state-default ui-corner-all ui-button-text-icon" type="submit">
   <span class="ui-button-icon-primary ui-icon ui-icon-newwin"></span><span>Button</span></button>

 </body>
</html>