JSFiddle - React, Tailwind, and code Playground

HTML

<div class="entity">
     <h3>Rate me!</h3>  <span class="star"></span>

</div>

CSS

.star.starred:before {
    content:"\2605";
}
.star:before {
    content:"\2606";
}
.star {
    font-size: 2em;
    cursor: pointer;
}
.star:hover {
    text-shadow: 0px 0px 3px yellow;
}
.star.starred:hover {
    text-shadow: 0px 0px 3px red;
}

JavaScript

$('.star').on('click', function () {
    $(this).toggleClass('starred');

    if ($(this).is('.starred')) {
        // Do something to record that this is a favourite
    }
});