Edit in JSFiddle

$(function () {
  var sec = 0;
  var min = 0;
  var hour = 0;

  var timer;

  // スタート
  $('#start').click(function() {
    // 00:00:00から開始
    sec = 0;
    min = 0;
    hour = 0;
    $('#clock').html('00');
    timer = setInterval(countup, 1000);

    $(this).prop('disabled', true);
    $('#stop,#reset').prop('disabled', false);
  });

  // ストップ
  $('#stop').click(function() {
    // 一時停止
    clearInterval(timer);
    $(this).prop('disabled', true);
    $('#restart').prop('disabled', false);
  });

  // リスタート
  $('#restart').click(function() {
    // 一時停止から再開
    timer = setInterval(countup, 1000);

    $(this).prop('disabled', true);
    $('#stop').prop('disabled', false);
  });

  // リセット
  $('#reset').click(function() {
    // 初期状態
    sec = 0;
    min = 0;
    hour = 0;
    $('#clock').html('00:00:00');
    clearInterval(timer);

    $('#stop,#restart,#reset').prop('disabled', true);
    $('#start').prop('disabled', false);
  });
  $('#rap').click(function() {    
    $('#aho').append($("#clock").text()+"  "+$("#mudai").val()+"<br>");

  });
 /**
  * カウントアップ
  */
  function countup()
  {
    sec += 1;

    if (sec > 59) {
      sec = 0;
      min += 1;
    }

    if (min > 59) {
      min = 0;
      hour += 1;
    }

    // 0埋め
    sec_number = ('0' + sec).slice(-2);
    min_number = ('0' + min).slice(-2);
    hour_number = ('0' + hour).slice(-2);

    $('#clock').html(hour_number + ':' +  min_number + ':' + sec_number);
  }
});
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  <div id="clock">00:00:00</div>
<form>
<input type="button" id="start" value="Start">
<input type="button" id="stop" value="Stop" disabled>
<input type="button" id="restart" value="Restart" disabled>
<input type="button" id="reset" value="Reset" disabled>
<input type="button" id="rap" value="rap"><input type="text" size="10" value="無題" id="mudai">
<script src="https://code.jquery.com/jquery-2.0.3.js"></script>
</form>
   <div id="aho"></div>
   
</body>
</html>