Angular: Empty Fiddle

http://angularjs.org/

HTML

<script   src="https://code.jquery.com/jquery-3.1.0.min.js"   integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="   crossorigin="anonymous"></script>


<div id="stars3">
<i data-count="0" class="glyphicon glyphicon-star grey-light grey"></i> 
<i data-count="1" class="glyphicon glyphicon-star grey-light grey"></i> 
<i data-count="2" class="glyphicon glyphicon-star grey-light grey"></i> 
<i data-count="3" class="glyphicon glyphicon-star grey-light grey"></i> 
<i data-count="4" class="glyphicon glyphicon-star grey-light grey"></i> 
</div>

CSS

i.grey {
background: grey
}
i {
  width: 10px;
  height: 10px;
  display: inline-block;
  
}
i.yellow {
  background: yellow
}

JavaScript

$("#stars3 > i").hover(function() {
$(this).prevAll().addClass('yellow').removeClass('grey')
$(this).addClass('yellow').removeClass('grey')
$(this).nextAll().addClass('grey').removeClass('yellow')
});