miff2000/stars.html

## stars.html
<!DOCTYPE html />
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Stars</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
        <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script type="text/javascript" src="stars.min.js"></script>
        <style>
            .stars i { font-size: 48px; }
        </style>
    </head>
    <body>
        <div class="stars"></div>
        <script>
            $(".stars").stars({
                text: ["1 star", "2 star", "3 star", "4 star", "5 star"]
            });
        </script>
    </body>
</html>

## stars.min.js
!function(t){t.fn.stars=function(e){for(var s=t.extend({stars:5,emptyIcon:"fa-star-o",filledIcon:"fa-star",color:"#E4AD22",starClass:"",value:0,text:null,click:function(){}},e),a=this,l=0;l<s.stars;l++){var n=t("<i>").addClass("fa").addClass(s.emptyIcon).addClass(s.starClass);s.text&&n.attr("data-rating-text",s.text[l]),"none"!==s.color&&n.css("color",s.color),this.append(n)}if(s.text){var i=t("<div>").addClass("rating-text");this.append(i)}var r=this.find("i");if(r.on("mouseover",function(){var e=t(this).index()+1,l=r.slice(0,e);events.removeFilledStars(r,s),events.fillStars(l,s),s.text&&a.find(".rating-text").html(t(this).data("rating-text"))}).on("mouseout",function(){events.removeFilledStars(r,s),events.fillStars(r.filter(".selected"),s),s.text&&a.find(".rating-text").html("")}).on("click",function(){var e=t(this).index();s.value=e+1,r.removeClass("selected").slice(0,s.value).addClass("selected"),s.click.call(r.get(e),s.value)}),events={removeFilledStars:function(t,e){return t.removeClass(e.filledIcon).addClass(e.emptyIcon),t},fillStars:function(t,e){return t.removeClass(e.emptyIcon).addClass(e.filledIcon),t}},s.value>0){var o=r.slice(0,s.value);events.fillStars(o,s).addClass("selected")}return this}}(jQuery);
	<!DOCTYPE html />
	<html>
	<head>
	<meta charset="UTF-8" />
	<title>Stars</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
	<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="stars.min.js"></script>
	<style>
	.stars i { font-size: 48px; }
	</style>
	</head>
	<body>
	<div class="stars"></div>
	<script>
	$(".stars").stars({
	text: ["1 star", "2 star", "3 star", "4 star", "5 star"]
	});
	</script>
	</body>
	</html>