title: creating a simple stopwatch html
body: <p>I have been working on this stopwatch now for 5-6 hours. It is meant to be a simple stopwatch html. I am simply not grasping the issues/concepts. I hoping for a little help as all the W3Schools pages I've looked at along with other stack overflow problems have not gotten me any where near where I need to be. I am trying to create 3 <code>onclick</code> buttons within the html to start, stop, and reset(haven't even got to the reset portion). The "clock" should start at 0 and when stopped, it should be paused at the number and only started again from the <code>onclick</code> start. Reset button resets to 0.</p>
  
  <p>I have tried working with <code>getElementById</code> and <code>innerHTML</code>. I have gotten the button to work, but it was adding the "result" to itself 1,2,4,8, etc. I am sure it is a fairly simple fix, but I have tried different variations for hours upon hours.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang = "en"&gt;
      &lt;head&gt;
          &lt;title&gt;Stopwatch&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div&gt;Seconds: &lt;span id="time"&gt;&lt;/span&gt;&lt;/div&gt;
          &lt;input type="button" id="startTimer" value="Start Timer" onclick="start();"&gt;&lt;br/&gt;
          &lt;input type="button" id="stopTimer" value="Stop Timer"  onclick="stop();"&gt;&lt;br/&gt;
          &lt;input type="button" id="resetTimer" value="Reset Timer"  onclick="reset();"&gt;&lt;br/&gt;
          &lt;script src= "timer.js"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  var timeElapsed = 0;
  var myTimer = 0;
  
  function start() {
      myTimer = setInterval(function(){
          timeElapsed += 1;
           document.getElementById("time").innerText = timeElapsed;
      }, 1000) ;
  
  }
  function stop() {
      clearInterval(myTimer);
  }
  function reset() {
     timeElapsed = 0;
     clearInterval(myTimer);
     document.getElementById("time").innerHTML = timeElapsed;
  }
  </code></pre>