在第一个完成后运行第二个jQuery click函数

$(function() {
  var config = new Map([
    ['mentor', null],
    ['profile', null],
    ['image', null],
    ['package', null],
    ['payment', 0],
    ['url', null]
  ]);

  function view(config) {
    for (let [key, value] of config) {
      if (key === undefined) {
        break;
      }
      console.log(`${key}: ${value}`);
    }
  }

  $('.mentor').on('click', function(e) {
    $('.mentor').each(function() {
      $(this).addClass('disabled');
    });
    $(this).removeClass('disabled');

    var mentor = $(this).data('mentor');
    var profile = $(this).data('profile');
    var image = $(this).data('image');
    config.set('mentor', mentor);
    config.set('profile', profile);
    config.set('image', image);

    $('.image img').attr('src', $(this).data('image'));
    $('.packages').removeClass('disabled');
    $('.final').removeClass('disabled');
    console.log(view(config))
  });

  $('.package').on('click', function() {
    $('.package').each(function() {
      $(this).removeClass('active');
    });
    $(this).toggleClass('active');

    var package = $(this).data('package');
    var payment = parseFloat($(this).val());
    var url = $(this).data('url');
    config.set('package', package);
    config.set('payment', payment);
    config.set('url', url);

    $('#total').val(`$${payment.toFixed(2)}`);
    $('.summary').attr('href', `${config.get('url')}${config.get('profile')}`);
    console.log(view(config));
  });

});

html,
body {
  height: 100%;
  width: 100%;
  font: 400 16px/1.25 Consolas;
}

fieldset {
  width: fit-content;
  border-radius: 6px
}

.mentors {
  display: table;
}

.mentors button.button.mentor {
  display: table-cell;
}

figure.image {
  display: block;
  margin: 0 auto;
}

.image img {
  width: 90px;
  min-height: 90px;
  display: block;
  margin: 0 auto;
  border: 3px inset grey
}

.button {
  display: inline-block;
  border: 1px solid green;
  margin: 5px 2.5px;
  padding: 3px 5px;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;
  background: none;
}

.active {
  background: black;
  color: white;
}

.disabled {
  opacity: 0.4;
  cursor: default;
}

.summary {
  text-align: center;
}

#total {
  width: 118px;
  display: inline-block;
}

label {
  display: inline-block;
  margin-left: 20px;
}

.as-console-wrapper {
  width: 200px;
  min-height: 100%;
  margin-left: 65%;
}

.as-console-row.as-console-row::after {
  content: '';
  padding: 0;
  margin: 0;
  border: 0;
  width: 0;
}

<fieldset class='mentors'>
  <legend>Pick a Mentor</legend>
  <button class="mentor button" data-mentor="john-smith" data-profile='#John%20Smith' data-image='https://www.eikonphoto.com/wp-content/uploads/2017/03/male-headshot-e1515783468636.jpg'>John Smith</button>
  <button class="mentor button" data-mentor="jane-doe" data-profile='#Jane%20Doe' data-image='https://www.eikonphoto.com/wp-content/uploads/2016/07/professional-headshots-in-washington-dc-e1473098078630.jpg'>Jane Doe</button>
  <figure class='image'>
    <img src='https://www.computerhope.com/jargon/b/black.jpg' width='90px' height='90px'>
  </figure>
</fieldset>

<fieldset class='packages disabled'>
  <legend>Select Courses</legend>
  <button class="package button" data-package="express" data-url='https://example.com/exp.html' value='19.99'>Express</button>
  <button class="package button" data-package="growth" data-url='https://example.com/grw.html' value='29.99'>Growth</button>
  <button class="package button" data-package="mentor" data-url='https://example.com/mtr.html' value='49.99'>Mentor</button>
  <button class="package button" data-package="advanced" data-url='https://example.com/adv.html' value='74.99'>Advanced</button>
</fieldset>

<fieldset class='final disabled'>
  <a href='#/' class="summary button">Proceed<br>to<br>Payment</a>
  <label>Total: </label>
  <output id='total'></output>
</fieldset>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

jQuery(document).ready(function($) {

  $('#mentor-package a').addClass("gray-out");
  $('#mentor-final a').addClass("gray-out");


  $('#mentor-choose .button').click(function() {

    var mentor = $(this).data('mentor');
    console.log(mentor);

    $('#mentor-final .summary').attr('data-mentor', mentor);
    $('#mentor-package a').removeClass("gray-out");

  });

  $('#mentor-package .button').click(function() {

    var package = $(this).data('package');
    console.log(package);

    $('#mentor-final .summary').attr('data-package', package);

    $('#mentor-final a').removeClass("gray-out");

  });



  $('.button').click(function() {

    if ($('#mentor-final .summary').data('mentor') === 'john-smith' && $('#mentor-final .summary').data('package') === 'express') {

      console.log('John Smith - express');

    } else if ($('#mentor-final .summary').data('mentor') === 'john-smith' && $('#mentor-final .summary').data('package') === 'growth') {

      console.log('John Smith - growth');

    } else if ($('#mentor-final .summary').data('mentor') === 'john-smith' && $('#mentor-final .summary').data('package') === 'mentor') {

      console.log('John Smith - mentor');

    } else if ($('#mentor-final .summary').data('mentor') === 'john-smith' && $('#mentor-final .summary').data('package') === 'advanced') {

      console.log('John Smith - advanced');

    }

  });

});

#mentor-choose {
  display: flex;
  flex-direction: column;
}

#mentor-package {
  display: flex;
  flex-direction: column;
}

.gray-out {
  color: grey;
  pointer-events: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mentor-choose">

  <a href="#" class="button green" data-mentor="john-smith">Select John Smith</a>

  <a href="#" class="button green" data-mentor="jane-doe">Select Jane Doe</a>

</div>

<div id="mentor-package">

  <a href="#" class="button green" data-package="express">Select Express</a>

  <a href="#" class="button green" data-package="growth">Select Growth</a>

  <a href="#" class="button green" data-package="mentor">Select Mentor</a>

  <a href="#" class="button green" data-package="advanced">Select Advanced</a>


</div>

<div id="mentor-final">

  <a href="#" class="summary button green">Proceed to Payment</a>

</div>