Rate us slider

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/overcast/jquery-ui.css">
<div class="question">
    <h2>How would you rate us?</h2>
    <label><input type="radio" name="rate" value="1"/>Poor</label>
    <label><input type="radio" name="rate" value="2"/>Ok</label>
    <label><input type="radio" name="rate" value="3"/>Ok</label>
    <label><input type="radio" name="rate" value="4"/>Ok</label>
    <label><input type="radio" name="rate" value="5"/>Ok</label>
    <label><input type="radio" name="rate" value="6"/>Ok</label>
    <label><input type="radio" name="rate" value="7"/> -</label>
    <label><input type="radio" name="rate" value="8"/>Great</label>
</div>
<p><button>Get Value</button></p>

CSS

label { display: block; float: left; text-align: center; width: 33%; }
.ui-widget{ font-size: 15px;}
.ui-widget-content{ background: none; }
.ui-slider-horizontal { clear: left; padding: 0 4px 0 2px; margin: 0 auto; width: 67%;}
.ui-slider-horizontal .ui-slider { background: none; border:0; height: 2em; margin: 0 auto;  }
.ui-slider-horizontal .ui-handle-helper-parent { position: relative; width: 100%; height: 100%; margin: 0 auto; }
.ui-slider-horizontal .ui-slider-handle { top: -2px; height: 15px;}
.ui-slider-horizontal .ui-slider-handle .ui-icon { margin: -8px auto 0; position: relative; top: 50%; }

JavaScript

var question = $(".question");
   var radios = question.find(":radio").hide();
//build slider
var scrollbar = $("<div></div>").slider({
    range: "min",
    min: parseInt(radios.first().val(), 10),
      max: parseInt(radios.last().val(), 10),
    slide:function(e, ui){
        radios.filter("[value=" + ui.value + "]").click();
        
    }
}).appendTo(question);

//append icon to handle
var handleHelper = scrollbar.find('.ui-slider-handle')
.css({"width":"40px", "margin-left":"-30px"})
.append('<span class="ui-icon ui-icon-grip-dotted-vertical"></span>')
.wrap('<div class="ui-handle-helper-parent"></div>')
.parent();


$("button").click(function() {
    alert($(":radio[name='rate']:checked").val());
});