title: How to properly use clearInterval
body: <p>I want this reset button to clear/reset the timer. I need it to reset because when the user presses the start button more then once it set´s two timers one that was started previously and the one that was just started.</p>
  <p>I´m going to use clearInterval to fix this.</p>
  <p>Here is my timer:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);
  
        minutes = minutes &lt; 10 ? "0" + minutes : minutes;
        seconds = seconds &lt; 10 ? "0" + seconds : seconds;
  
        display.textContent = minutes + ":" + seconds;
  
        if (--timer &lt; 0) {
            timer = duration;
        }
        function resetTimer(){
            clearInterval(timer);
        }
    }, 1000);
  }
  
  function start5Timer() {
    var fiveMinutes = 60 * 5,
        display = document.querySelector('#time');
    startTimer(fiveMinutes, display);
  };</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;body&gt;
      &lt;div&gt;&lt;span id="time"&gt;05:00&lt;/span&gt; minutes!
      &lt;button onclick="start5Timer()"&gt;start&lt;/button&gt;
      &lt;button onclick="resetTimer()"&gt;reset&lt;/button&gt;
      &lt;/div&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>