setTimeout does not work

I'm very beginning with js and I have no idea why it doesn't countdown. Any tips? (it also doesn't work when I use setInterval).

When eventDate is a kind of any usual date like

var eventDate =new date (2016,12,25);

it works. The console does not show any mistakes.

    
        function countdown() {
            var now = Date.parse(new Date);
            var eventDate = new Date(now + 1800000);
    
            var remTime = eventDate - now;
    
            var s = Math.floor(remTime / 1000);
            var m = Math.floor(s / 60);
    
            m %= 60;
            s %= 60;
    
            m = (m < 10) ? "0" + m : m;
            s = (s < 10) ? "0" + s : s;
    
            document.getElementById("minutes").textContent = m;
            document.getElementById("seconds").textContent = s;
    
            setTimeout("countdown()", 1000);
        }
    
        countdown();

body {
                 background: #f6f6f6;
             }
    
             .countdownContainer {
                 position: absolute;
                 top: 50%;
                 left: 50%;
                 transform: translateX(-50%) translateY(-50%);
                 text-align: center;
                 background: #ddd;
                 border: 1px solid #ddd;
                 padding: 10px;
                 box-shadow: 0 0 5px 3px #ccc;
             }
    
             .info {
                 font-size: 80px;
             }

<!DOCTYPE html>
    <html>
    <head>
        <title>Christmas Countdown</title>
       
    </head>
    <body>
    <table class="countdownContainer">
        <tr class="info">
            <td colspan="4">Christmas Countdown</td>
        </tr>
        <tr class="info">
            <td id="minutes">12</td>
            <td id="seconds">22</td>
        </tr>
        <tr>
            <td>Minutes</td>
            <td>Seconds</td>
        </tr>
    </table>
    </body>
    </html>

Solution

There are couple of things wrong here one with code and second with logic of the function.

First of all you need to pass function in the setTimeout therefore it should be setTimeout(countdown, 100);

Secondly in the logic you are calculating

var now = Date.parse(new Date);

var eventDate = new Date(now + 1800000);

and then calculating deference of both which will result in the same value for each loop.

var eventDate = new Date(Date.parse(new Date) + 1800000);

function countdown() {
  var now = Date.parse(new Date);


  var remTime = eventDate - now;

  var s = Math.floor(remTime / 1000);
  var m = Math.floor(s / 60);

  m %= 60;
  s %= 60;

  m = (m < 10) ? "0" + m : m;
  s = (s < 10) ? "0" + s : s;

  document.getElementById("minutes").innerHTML = m;
  document.getElementById("seconds").innerHTML = s;

  setTimeout(countdown, 1000);
}

countdown();

body {
  background: #f6f6f6;
}
.countdownContainer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
  background: #ddd;
  border: 1px solid #ddd;
  padding: 10px;
  box-shadow: 0 0 5px 3px #ccc;
}
.info {
  font-size: 80px;
}

<table class="countdownContainer">
  <tr class="info">
    <td colspan="4">Christmas Countdown</td>
  </tr>
  <tr class="info">
    <td id="minutes">12</td>
    <td id="seconds">22</td>
  </tr>
  <tr>
    <td>Minutes</td>
    <td>Seconds</td>
  </tr>
</table>