how to make track progress bar using checkboxe value

I want to make track your progress section using checkbox values. So, how it works is simple. see there are two pages page one and page two. On page one there are some checkboxes and on page two there is a one progress bar. when user click on checkbox from page one it should increase value of progress bar from another page. But i dont know how to do this with two page. I have tried with one page only. Here is the code:

   jQuery(document).ready(function() {
   jQuery('.progressbar_chkbox').on('click', function() {
   var currValue = 0;

  jQuery(".progressbar_chkbox:checked").each(function() {
        currValue += parseInt($(this).val());
   });

currValue = Math.min(currValue, 100);

 jQuery('#progress-bar').css('width', currValue + '%').attr('aria-valuenow',      
    currValue);   
     });
      });

     <script  
     src="http://ift.tt/1oMJErh">
    </script>
    <!-- Begin checkboxes -->
   <div class="panelBody" id="panelBody1">

    <input id="input1" class="progressbar_chkbox videoChecks" 
     type="checkbox" name="completed1" value="20">
    <input id="input2" class="progressbar_chkbox videoChecks" 
     type="checkbox" name="completed2" value="20">
     <input id="input3" class="progressbar_chkbox videoChecks" 
    type="checkbox" name="completed3" value="20">
   <input id="input4" class="progressbar_chkbox videoChecks" type="checkbox" 
  name="completed4" value="20">
    <input id="input5" class="progressbar_chkbox videoChecks"  
   type="checkbox" name="completed5" value="20">
  
    </div>

      
        <div class="progress">
      <div id="progress-bar" class="progress-bar progress-bar-success"  
       role="progressbar" 
      aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
      </div>
     </div>