I have a JS function to save and load content of a notepad I've made, locally.
I tried to replicate this for a div which contains times of a stopwatch.(see code below)

The stopwatch when paused will write it's time to this div to be saved, I want these times to save when I refresh / close and reopen the page.

It works for my notes in the notepad, please can someone explain where I'm going wrong?

JavaScript for save function:

```
  //Storage of Text-Box

  const notesInput = document.querySelector('#notes');
  function remFunc() {
    // store the entered name in web storage
    localStorage.setItem('notes', notes.value);
  }

  function loadfunc() {

    if(localStorage.getItem('notes')) {
      let notes_var = localStorage.getItem('notes');
      notes.value= notes_var;
    } else {
    }
  }

  document.body.onload = loadfunc();

 //Storage of Times DIV

    const output = document.querySelector('#output');
    function remfunc2() {  
      localStorage.setItem('output', outContent.innerHTML);
    }

    function loadfunc2() {
      if(localStorage.getItem('output')) {
        let output_var = localStorage.getItem('output');
        output.innerHTML = output_var ;
      } else {

      }
    }

    document.body.onload = loadfunc2();

```

This is the div:

```
<div id="output" name="output" class="buttonZ logPad"></div>

```

Here is the stopwatch Javascript:

```
  // Timer JS

  var flagclock = 0;
  var flagstop = 0;
  var stoptime = 0;
  var splitcounter = 0;
  var currenttime;
  var splitdate = '';
  var output;
  var clock;

  function startstop()
  {
    var startstop = document.getElementById('startstopbutton');
    var startdate = new Date();
    var starttime = startdate.getTime();
    if(flagclock==0)
    {
      startstop.value = 'Stop';
      flagclock = 1;
      counter(starttime);
    }
    else
    {
      startstop.value = 'Start';
      flagclock = 0;
      flagstop = 1;
      splitdate = '';
      logTime();
    }
  }

  function counter(starttime)
  {
    output = document.getElementById('output');
    clock = document.getElementById('clock');
    currenttime = new Date();
    var timediff = currenttime.getTime() - starttime;
    if(flagstop == 1)
    {
      timediff = timediff + stoptime
    }
    if(flagclock == 1)
    {
      clock.innerHTML = formattime(timediff,'');
      clock.setAttribute('value', formattime(timediff, ''));
      refresh = setTimeout('counter(' + starttime + ');',10);
    }
    else
    {
      window.clearTimeout(refresh);
      stoptime = timediff;
    }
  }

  function formattime(rawtime,roundtype)
  {
    if(roundtype == 'round')
    {
      var ds = Math.round(rawtime/100) + '';
    }
    else
    {
      var ds = Math.floor(rawtime/100) + '';
    }
    var sec = Math.floor(rawtime/1000);
    var min = Math.floor(rawtime/60000);
    ds = ds.charAt(ds.length - 1);
    if(min >= 60)
    {
      startstop();
    }
    sec = sec - 60 * min + '';
    if(sec.charAt(sec.length - 2) != '')
    {
      sec = sec.charAt(sec.length - 2) + sec.charAt(sec.length - 1);
    }
    else
    {
      sec = 0 + sec.charAt(sec.length - 1);
    }
    min = min + '';
    if(min.charAt(min.length - 2) != '')
    {
      min = min.charAt(min.length - 2)+min.charAt(min.length - 1);
    }
    else
    {
      min = 0 + min.charAt(min.length - 1);
    }
    return min + ':' + sec + ':' + ds;
  }

  function resetclock()
  {
    flagstop = 0;
    stoptime = 0;
    splitdate = '';
    window.clearTimeout(refresh);

    if(flagclock !== 0) {
      startstopbutton.value = 'Start';
      flagclock = 0;
      flagstop = 1;
      splitdate = '';
    }

    if(flagclock == 1)
    {
      var resetdate = new Date();
      var resettime = resetdate.getTime();
      counter(resettime);
    }
    else
    {
      clock.innerHTML = "00:00:0";
    }
  }

  //Split function

  function splittime()
  {
    if(flagclock == 1)
    {
      if(splitdate != '')
      {
        var splitold = splitdate.split(':');
        var splitnow = clock.innerHTML.split(':');
        var numbers = new Array();
        var i = 0
        for(i;i<splitold.length;i++)
        {
          numbers[i] = new Array();
          numbers[i][0] = splitold[i]*1;
          numbers[i][1] = splitnow[i]*1;
        }
        if(numbers[1][1] < numbers[1][0])
        {
          numbers[1][1] += 60;
          numbers[0][1] -= 1;
        }
        if(numbers[2][1] < numbers[2][0])
        {
          numbers[2][1] += 10;
          numbers[1][1] -= 1;
        }
      }
      splitdate = clock.innerHTML;
      output.innerHTML += (++splitcounter) + '. ' + clock.innerHTML + '\n';
    }
  }
  function logTime() {
    const time = document.getElementById('clock').getAttribute('value');
    document.getElementById('output').innerHTML += (++splitcounter) + '. ' + time + '<br />'; 
  }

  function time() {
    splittime();
    resetclock();            
  }

```

Any help will be much appreciated! Thank you.