Updating a field's change I'm writing simple jQuery script for updating one field on another field's change. It's working, but I'm trying to write good code and use best practices. Can you please tell me what my mistakes and 'bad' things in this code? 

Maybe I should use getTotalUserScore() in updateTotalUserScore(), not in $('.js-question-score').change() function, or I shouldn't use 2 functions for so simple piece of logic, or my variables names are bad. Tell me anything you feel about this code. Also, I've realized that my total-score field sometimes updates with delay.



$('.js-question-score').change(function () {
    var totalScore = getTotalUserScore();
    updateTotalUserScore(totalScore);
});

function updateTotalUserScore(totalScore) {
    $('.js-total-user-score').text(totalScore)
}

function getTotalUserScore() {
    var totalScore = 0;
    $('.js-question-score').each(function() {
        totalScore += parseInt($(this).val());
    });
    return totalScore;
}
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;form&gt; 
  &lt;input class="js-question-score" name="first" min="0" max="20"  value="0" type="number"/&gt;
  &lt;input class="js-question-score" name="second" min="0" max="20"  value="0" type="number"/&gt;
  &lt;input class="js-question-score" name="third" min="0" max="20"  value="0" type="number"/&gt;
&lt;/form&gt;

&lt;div&gt;
  User total score:
  &lt;span class="js-total-user-score"&gt;
    0
  &lt;/span&gt;
&lt;/div&gt;
You can do it in only one event. Get sums of all value on each changement like this : 



$(".js-question-score").change(function(){
  var res=0;
  $(".js-question-score").each(function()
  {
    res+=parseInt($(this).val());
  });
   $(".js-total-user-score").text(res);
});
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;form&gt; 
  &lt;input class="js-question-score" name="first" min="0" max="20"  value="0" type="number"/&gt;
  &lt;input class="js-question-score" name="second" min="0" max="20"  value="0" type="number"/&gt;
  &lt;input class="js-question-score" name="third" min="0" max="20"  value="0" type="number"/&gt;
&lt;/form&gt;

&lt;div&gt;
  User total score:
  &lt;span class="js-total-user-score"&gt;
    0
  &lt;/span&gt;
&lt;/div&gt;