Rating system follow by mouse php

Hi I am trying to create rating system and now I am working on to change color of the star while user move the mouse I had this code but I dont know why this is not working. I have form with star container

<form>
  <div class="form-group">
  <div class="modal-body">
        <h4 class="text-center mt-2 mb-4">
            <i class="fas fa-star star-light submit_star mr-1" id="submit_star_1" data-index="1"></i>
            <i class="fas fa-star star-light submit_star mr-1" id="submit_star_2" data-index="2"></i>
            <i class="fas fa-star star-light submit_star mr-1" id="submit_star_3" data-index="3"></i>
            <i class="fas fa-star star-light submit_star mr-1" id="submit_star_4" data-index="4"></i>
            <i class="fas fa-star star-light submit_star mr-1" id="submit_star_5" data-index="5"></i>
        </h4>
    <label for="reviewer-name" class="col-form-label">Your name:</label>
    <input type="text" class="form-control" id="reviewer-name">
  </div>
  <div class="form-group">
    <label for="message-text" class="col-form-label">Review:</label>
    <textarea class="form-control" id="message-text"></textarea>
  </div>
</form>

and this function mouseenter

$('.submit_star').on('mouseenter', function(){

    var rating = $(this).data('rating');

    reset_background();

    for(var count = 1; count <= rating; count++)
    {

        $('#submit_star_'+count).addClass('text-warning');

    }

});

Any idea what could be wrong will be great, thanks