Because you have only one instance of date. You must use 2 variables of date.

You need to make a new date object if you want a new time. Change your javascript to this:

    let date = new Date();
    let start = date.getHours() + date.getMinutes() / 60 + date.getSeconds() / 60 / 60;
    function startRecord() {
      date = new Date();
      document.getElementById("1").innerHTML = start;
    }
    function endRecord() {
      date = new Date();
      let end = date.getHours() + date.getMinutes() / 60 + date.getSeconds() / 60 / 60;
      document.getElementById("2").innerHTML = end;
    }

Your code gets the current date/time at the time the script loads, not when the button is clicked.

You need to get the date/time in the click handler, so it reflects the moment the click happened.

Since you need to do the same calculation in both click handlers, put that logic in a function and call it from both click handlers:

function getCurrentTime() {
  const date = new Date();
  return date.getHours() + date.getMinutes() / 60 + date.getSeconds() / 60 / 60;
}  

function startRecord() {
  document.getElementById("1").innerHTML = getCurrentTime();
}

function endRecord() {
  document.getElementById("2").innerHTML = getCurrentTime();
}

<p id="1">Show start time</p>
<p id="2">Show end time</p>

<button type="button" onclick="startRecord()">
  start
</button>
<button type="button" onclick="endRecord()">
  end
</button>