jQuery Mouseup only triggers on second click

Question

I have a checkbox that is being selected by label. I am then adding a class of selected to the parent li. Once this happens I want to count the instances of '.gquiz-correct-choice .gquiz-indicator' on the page.

The count is only updated if I click a second time.

I've tried adding 'return false'. Binding the click & mouseup, using change instead of mouseup, but I can't seem to make it work.

 jQuery(document).on('click', '.gfield_radio li label', function(event) {
   jQuery(this).parent('li').addClass('selected');
 });

 jQuery('.gfield_radio li label').mouseup(function(){
    var numItems = jQuery('.gquiz-correct-choice .gquiz-indicator').length;
    jQuery('.pts').html(numItems + '/20');
    return false;
  });

Answer 1

The first click seemed to be 'hijacked' so I decided to add a timeout to run the count after.

jQuery(document).on('click', '.gfield_radio li label', function(event) {
 jQuery(this).parent('li').addClass('selected');
    setTimeout(
        function() {
          var numItems = jQuery('.gquiz-correct-choice .gquiz-indicator').length;
          jQuery('.pts').html(numItems + '/20');            },
      500);
  });