title: Pause / Resume jQuery Countdown Timer
body: <p>I'm trying to make a countdown timer that can be paused with a single HTML5 button tag using a JS <code>onClick()</code> event, or more preferably, using jQuery with something like <code>$("#pause_resume").off('click').on('click', firstClick)</code>in conjunction with another function. Logically, I would assume the task would require getting the current values of both <code>$.min</code> and <code>$.sec</code> and then setting these values, while switching functions, until the "resume" button is pressed again. But I honestly have no idea how to go about doing this. I've looked at other code on this site and others, but what I saw was heavily deprecated and not in line with my project plan. Any insight is appreciated.</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;p class="timer"&gt;
     &lt;span class="min"&gt;&lt;/span&gt;:&lt;span class="sec"&gt;&lt;/span&gt;/
     &lt;span class="fullTime"&gt;1:30&lt;/span&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p><strong>JavaScript:</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      var timer = $('.timer');
      var leadingZero = function(n) {
          if (n &lt; 10 &amp;&amp; n &gt;= 0)
              return '0' + n;
          else
              return n;
      };
      var minutes = 1;
      var seconds = 30;
      setInterval(function () {  
          var m = $('.min', timer),
              s = $('.sec', timer);
          if (seconds == 0) {
              minutes--;
              seconds = 59;
          } else {
              seconds--;
          }
          m.text(minutes);
          s.text(leadingZero(seconds));
  
      }, 1000);
  &lt;/script&gt;
  </code></pre>