javascript - すべてのインスタンスにドラッグ可能な属性を割り当てる方法

Question

これは簡単な質問だと思いますが、jquery を使用するのは非常に初めてなので、すみません。

ランダムに選択された 5 つの画像を「処理」し、そのうちの 3 つ (ユーザーが選択したもの) を div にドロップできるようにする関数を作成しようとしています。

画像のランダム化を処理する配列を設定し、div をドロップ可能にする方法を見つけました。私の最初の問題は、「配られた」最初の画像だけがドラッグ可能であることです。私には論理エラーがあるようfunction dealCard()です...

function dealCard(i) {
    if (numberOfCardsInDeck == 0) return false;

    var img = document.createElement("img");
    img.src = "http://debsiepalmer.com/images/companions/" + cardsInDeck[i] + ".jpg";
    img.id = "drag"
    document.body.appendChild(img);
    $('#drag').draggable();
    removeCard(i);
}

function removeCard(c)
{

    for (j=c; j <= numberOfCardsInDeck - 2; j++)
    {
        cardsInDeck[j] = cardsInDeck[j+1];
    }
    numberOfCardsInDeck--;
    numberOfCardsInDeck--;
    numberOfCardsInDeck--;
}

...私の人生では、ドラッグ可能な属性を残りの画像に再割り当てしない理由がわかりません。誰かが私を正しい方向に向けることができますか?

私のフィドルは: http://jsfiddle.net/LEHbc/22/