Question: I'm grabbing an array of jQuery objects and then via .each() modifying each individual jquery with in the array.

In this case I'm updated the class names to trigger a -webkit-transition-property to utilize a css transition. 

I'd like there to be a pause before each css transition begins. I'm using the following, but there is no delay in between each update. Instead, they all appear to be updating at once. 

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

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

```

I was hoping setTimeout would solve this, but it doesn't seem to be working. Is there a way to accomplish the pause before each CLASS name update of each object?

Answer: 
Sorry for digging up an old thread, but this tip could be useful for similar issues: 

```
$cards.each(function(index) {
    $(this).delay(500*index).addClass('position');
});

```
How about [.delay()](http://api.jquery.com/delay/) ?

or 

```
function addPositioningClasses($card){
  setTimeout(function() { $card.addClass('position')}, 1000);
}

```