I have a form that is broken up into six pages. The first three pages act as qualifying questions for an application, and the last three pages are the application itself. I have code (as below) to control the Next button for the first three pages based on input/answer selections. All works great! But then how do I get the next button to return and behave normally/show for the remainder of the application pages (and not mess anything up with the first three pages)?

 Page 1:

$(document).ready(function(){
  $(".pcn input").change(validate);
  validate();
  $('.cf-next-btn').click(validate);
  function validate() {
    if ($(".pcn input").parsley({excluded:":hidden"}).isValid()) {
      $('.cf-next-btn').show();
    }
    else {
      $('.cf-next-btn').hide();
    }
  }
});

Page 2: 

$(document).ready(function(){
  $('.cf-next-btn').click(function () {
  $('.cf-next-btn').hide();
  $('.affected input').change(function(){
      if($('.affected input[value="Yes"]:checked').length > 0){
      $('.cf-next-btn').show();
    }
    else{
      $('.cf-next-btn').hide();
      alert ('Show first alert.');
    }
  });
  });
});

Page 3:

$(document).ready(function(){
  $('.cf-next-btn').click(function () {
  $('.cf-next-btn').hide();
  $('.income input').change(function(){
      if($('.income input[value="Yes"]:checked').length > 0){
      $('.cf-next-btn').show();
    }
    else{
      $('.cf-next-btn').hide();
      alert ('Show second alert.');
    }
  });
  });
});

Pages 4-6 = application that the submitter has now qualified to complete and submit.

Thank you.