Показать два элемента div друг за другом, используя таймер и JS / Promise

Question

Проблема:

У меня есть два деления, которые я буду sh показывать друг за другом с задержкой 15 секунд.

HTML / CSS:

<style>
  .js-success,
  .js-danger {
    display: none;
  }
</style>

<h2 class="js-success">
  <span class="badge badge-success"><i class="fas fa-clock"></i></span>
</h2>
<h2 class="js-danger">
  <span class="badge badge-danger"><i class="fas fa-clock"></i></span>
</h2>

JavaScript:

/**
 * Shows and hides steps
 */

const hasClass = (node, className) => node.className.indexOf(className) > -1;

const nodeVisible = (node, show = true) => {
  const showCssClass = "d-block";
  if (show) {
    if (!hasClass(node, showCssClass)) {
      node.classList.add(showCssClass);
    }
  } else {
    node.classList.remove(showCssClass);
  }
};

/**
 * Timer
 */

const timer = (count) => new Promise(resolve => {
  let counter = setInterval(() => {
    count = count - 1;
    if (count < 0) {
      clearInterval(counter);
      resolve();
      return;
    }
  }, count);
});

/**
 * Call timer
 */

timer(15)
  .then(() => {
      const success = node.querySelector(".js-success");
      nodeVisible(success); 
  });

nodeVisible работает без проблем, но по некоторым причинам успех Значок виден непосредственно при загрузке страницы, несмотря на наличие display: none.

Желаемый результат:

I * sh, что .js-success будет отображаться через 15 секунд, затем его следует заменить через .js-danger еще через 15 секунд.