I'll be darned -- I cannot get the concept.

Here's the code. When I use context.drawImage directly in the imageObject.onload function, it draws the card on the canvas. But when I capture the drawImage into an array and later context.drawImage using the array I get nothing.

What concept am I missing?

Code:
<!DOCTYPE html>
<html>
 <head>
  <title>Simple Solitare</title>
  <meta name="Description" content="Solitare that compares adjacent / adjacent - 3 card for omatch on suit or ordinal.">
  <style>
   #canvas {

   }
  </style>
 </head>
 <body>
  <canvas id='canvas' width='600' height='300'>
    Canvas not supported
  </canvas>
  <script src="deck.js"></script>
  <script type="text/javascript">
   var canvas = document.getElementById('canvas'),
      context = canvas.getContext('2d');
   var cardsPlayed = new Array;
	 Deal(); 				// populate a card deck (in deck.js)
	 card = GetNextCard();	// (also in deck.js)
   var imageObj = new Image();
     imageObj.src = card + ".gif";
     imageObj.onload = function() {
//	 	  context.drawImage(imageObj, 69, 10);  	WORKS WHEN UNCOMMENTED
	 	cardsPlayed[0] = imageObj;
     } // end onload.function
// alert("game2c");
context.drawImage(cardsPlayed[0], 69, 10);		//	DOES NOT WORK
  </script>
 </body>
</html>
Regards,

grNadpa