[jQuery] Iterating through an array

[jQuery] Iterating through an array


Hi,
Sorry if this is a really basic query, but I'm just getting my toes
wet with both javascript and jquery.
I've written the following:
    $(document).ready(function() {
         cardgen();
    });
    function cardgen()
    {
    var cards =
['ac','2c','3c','4c','5c','6c','7c','8c','9c','10c','jc','qc','kc',
    'ah','2h','3h','4h','5h','6h','7h','8h','9h','10h','jh','qh','kh',
    'as','2s','3s','4s','5s','6s','7s','8s','9s','10s','js','qs','ks',
    'ad','2d','3d','4d','5d','6d','7d','8d','9d','10d','jd','qd','kd'];
    $.each(cards,function() {
        $("#card").attr("src","cards/"+this+".png");
    });
    }
My thinking was that this would run through displaying each of the
card images... but it doesn't seem to do so - I only see the last
card... Do I need to insert a pause somewhere? And if I do that, is it
also possible to monitor for a click?
Or is there a better way?
All the best,
--
Ian