画面表示をしたときにデフォルトでは時間が9:00と表示され、
終了時刻のチェックボックスにチェックを入れたら22:00に切り替わり、チェックボックスを外したら21:00に切り替わるという実装をしたいと考えていますが上手くいきません。(画面表示をしたときにデフォルトでは時間が9:00というのはできてます。)
どのように修正したらよろしいでしょうか。お願いいたします。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>あいうえお商店</title>

  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link type="text/css" rel="stylesheet" href="css/bootstrap-timepicker.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="js/bootstrap-timepicker.min.js"></script>
  <style>.input-group.timepicker { display: inline-table;
   vertical-align: middle; }</style>

 </head>
 <body>
   <div class="container">
    <p>あいうえお商店</p>
    <p>住所：東京都千代田区</p>
    <form class="form-inline" name="form1">
      <div class="form-group">
        <label class="control-label" style="font-weight:normal;" for="businesshours">時間：</lab    el>
        <div class="input-group bootstrap-timepicker timepicker" style="width:110px">

          <input type="text" id="businesshours" class="form-control input-small timepicker1">
          <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
        </div> ～ 
        <div class="input-group bootstrap-timepicker timepicker" style="width:110px">
          <input type="text" class="form-control input-small timepicker1">
          <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
        </div>
        <div class="checkbox" style="position:relative;left:45px;display:block;margin-bottom: 0p    x;margin-top: 0px;">
          <label><input id="Checkbox1" value="" type="checkbox">終了時刻</label>
        </div>
        <a class="btn btn-primary" href="#">戻る</a>
      </div>
    </form>
  </div>
  <script type="text/javascript">
    $(function() {
     $('.timepicker1').timepicker({

      showMeridian: false,
      minuteStep: 1,
      defaultTime: "9:00"
    });

     $('#Checkbox1').click(function() {
      if ($(this).prop('checked') == true) {
        $('.timepicker1').timepicker({

          showMeridian: false,
          minuteStep: 1,
          defaultTime: "22:00"
        });
      }else{
        $('.timepicker1').timepicker({

          showMeridian: false,
          minuteStep: 1,
          defaultTime: "21:00"
        });
      }
    });
   });

 </script>
</body>