Как можно сделать иконки рейтинга в зависимости от значения на JS?

Question

[Виолетта]

Есть div в котором выводится значение рейтинга, подскажите как можно сделать, чтобы рядом выводились звездочки закрашенные в зависимости от выводимого значения на JS? Вот сам код где происходит вывод значения:

<div class="stat-items">
	<div title="" class="stat-item"><span class="title">Рейтинг:</span> <span class="value">4.50</span></div>
	<div title="" class="stat-item"><span class="title">Просмотры:</span> <span class="value">1</span></div>
</div>

Нужно чтобы вместо слова Рейтинг выводились звездочки соотносящиеся к значению рейтинга. В данном примере величина 4.5

Есть пример кода , где происходит нужное действие, только в обратную сторону =) Помогите переделать его под эту задачу. Код примера где реализованы звездочки рейтинга https://jsfiddle.net/0ae4623s/

Answer 1

[Andrew]

https://codepen.io/jamesbarnett/pen/vlpkh

Comments

[Виолетта]

выглядит красиво, но ради пяти звездочек тянуть здороый css еще нужно.

Answer 2

[nvdfxx]

https://codepen.io/nvdfxx/pen/abObEjm

Comments

[Виолетта]

по моему это вообще что то другое )