title: disabled button after timer expired
body: <p>I am using <code>&lt;button&gt;</code> not <code>&lt;input type="button"&gt;</code> , I think there is big difference for that right?</p>
  
  <p>I just want that if the countdown is Expired the <code>&lt;button&gt;</code> will disable too, I don't know if my logic is correct for disabling the button but my countdown works like a charm</p>
  
  <p>I have this script inside of my html</p>
  
  <pre><code>&lt;button  class="main-btn main-btn-2" id="invite"&gt; &lt;a  href="{% url 'add' %}?parent_ID={{ me.id }}"  rel="nofollow"&gt;Invite Now&lt;/a&gt;&lt;/button&gt;
  
  {% for timer in countdown %}
  &lt;script&gt;
  var countDownDate = new Date("{{timer.enddate}}").getTime();
  
  var x = setInterval(function() {
  
  
    var now = new Date()
  
    var distance = countDownDate - now;
  
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  
    document.getElementById("demo").innerHTML = days + "d " + hours + "h "
    + minutes + "m " + seconds + "s ";
  
    if (distance &lt; 0) {
      clearInterval(x);
      document.getElementById("demo").innerHTML = "EXPIRED";
      document.getElementById("invite").disabled = true; // this is my logic if the timer expired the button will disabled
    }
  }, 1000);
  &lt;/script&gt;
  {% endfor %}
  </code></pre>