Turning a button into a jQuery UI icon?

How would I turn this button:

<%= button_to "+1", video_votes_path( :video_id => video.id, :type => "up" ), :remote => true %>

into an icon provided by jQuery UI?

I tried adding the class to it:

<%= button_to "+1", video_votes_path( :video_id => video.id, :type => "up" ), :class => 'ui-icon-tria开发者_运维技巧ngle-1-n', :remote => true %>

but this creates a weird looking button that still has '+1' inside of it.

I put this code in my application.js file:

$('input:submit, input:reset').each(function(){
      $(this).replaceWith('<button type="' + $(this).attr('type') + '">' + $(this).val() + '</button>');
     });

    $('button:submit').button({
      icons: {
       secondary: 'ui-icon-triangle-1-n'
      } 
    });

button_to actually generates an input element inside a form. jQuery UI only supports inputs of type submit and reset, so see if the generated markup falls under that category.

As for an actual solution, you could try converting the inputs into button tags. Take a look at this.