title: Create a "real time" countdown timer with jQuery
body: <p>My countdown timer resets every time I refresh the page.
  I need this countdown to reset only when it reaches zero, no matter how many times the page refreshes.</p>
  
  <p>I have no idea how to make the countdown timer work that way, could you help me?</p>
  
  <p>I need something like this: <a href="https://intellywp.com/evergreen-countdown-timer" rel="nofollow noreferrer">https://intellywp.com/evergreen-countdown-timer</a></p>
  
  <p>Here is my code:</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 contador() {
   var hr = "23";
   var mm = "59";
   var ss = "59";
  
      var interval = setInterval(function(){
  
          if(hr == 0 &amp;&amp; mm == 0 &amp;&amp; ss == 0)clearInterval(interval);
          ss--;
          if(ss == 0)
          {
              ss = 59;
              mm--;
              if(mm == 0)
              {
                  mm = 59;
                  hr--;
              }
          }
  
          if(hr.toString().length &lt; 2) hr = "0"+hr;
          if(mm.toString().length &lt; 2) mm = "0"+mm;
          if(ss.toString().length &lt; 2) ss = "0"+ss;
          $("#contador").html("&lt;span class='hora'&gt;"+hr+"&lt;/span&gt; : &lt;span class='minuto'&gt;"+mm+"&lt;/span&gt; : &lt;span class='segundo'&gt;"+ss+'&lt;/span&gt;');
  
      },1000)
  }
  window.onload = contador;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div id="contador" class="py-4"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>