Highlighting current and previous stars on mouseover
- by mpet
I'm trying to make simple five star rating system using Twitter Bootstrap 3 i jQuery. For now, I'm trying to set .hover() and .mouseout() events using counter by writing this code that doesn't work:
var i;
for (i = 1; i <= 5; i++) {
$('#overall_rating_' + i).hover(function(){
$('#overall_rating_' + i).removeClass("glyphicon-star-empty").addClass("glyphicon-star");
});
$('#overall_rating_' + i).mouseout(function(){
$('#overall_rating_' + i).removeClass("glyphicon-star").addClass("glyphicon-star-empty");
});
}
Trying to highlight current and previous stars on mouseover. The code is not complete, it would be accompanied by additional sub-counters, but this part doesn't work for now. Any better methods are welcome. What's broken here?
