Как добавить паузу между каждой итерацией jQuery .each ()?

Я беру массив объектов jQuery, а затем через .each () изменяю каждый отдельный jquery с помощью в массиве .

В этом случае я обновил имена классов, чтобы активировать свойство -webkit-transition-для использования перехода css.

Я бы хотел, чтобы перед началом каждого перехода css была пауза. Я использую следующее, но между каждым обновлением нет задержки. Вместо этого кажется, что все они обновляются одновременно.

function positionCards() {
  $cards = $('#gameboard .card');
  $cards.each(function() {
      setTimeout( function(){ addPositioningClass($(this)); }, 500 )
  });
}

function addPositioningClasses($card){
  $card
    .addClass('position')
}

Я надеялся, что setTimeout решит эту проблему, но похоже, что это не работает. Есть ли способ выполнить паузу перед каждым обновлением имени КЛАССА каждого объекта?