Przekazywanie wartości tablicy obrazów i zmiana źródła obrazu onclick

OK, więc w końcu grosz spadł (głośny trzask!) Na problem z kliknięciem, który tutaj miałemDołącz dynamiczny div tylko raz i problem JSFiddle. Kod pokazuje teraz użytkownikowi wybór zdjęć po kliknięciu jednego węzła. Uff.

Jednak teraz mójimg.src=e.target.src linia ma problemy z dostępem do innych obrazów w tablicy. Tylko ostatni obraz w tablicy doda się do tabeli. Myślę, że to dlatego, żeallImages.onclick zdarzenie powinno być w pętli?

Próbowałem tego, a potemimg jest wyświetlany jako niezdefiniowany. Zgaduję, że to dlatego, że pętla (a więc i funkcja) działa wcześniejvar img jest zadeklarowany? Myślę, że jest to problem z porządkiem rzeczy.

Cała pomoc została doceniona.

var makeChart = function () {
    var table = document.createElement('table'),
    taskName = document.getElementById('taskname').value,
    header = document.createElement('th'),
    numDays = document.getElementById('days').value, //columns
    howOften = document.getElementById('times').value, //rows
    row,
    r,
    col,
    c;

    var myImages = new Array();
    myImages[0] = "http://www.olsug.org/wiki/images/9/95/Tux-small.png";
    myImages[1] = "http://a2.twimg.com/profile_images/1139237954/just-logo_normal.png";
    for (var i = 0; i < myImages.length; i++) {
        var allImages = new Image();
        allImages.src = myImages[i];

        var my_div = document.createElement("div");
        my_div.id = "showPics";
        document.body.appendChild(my_div);
        var newList = document.createElement("ul");
        newList.appendChild(allImages);
        my_div = document.getElementById("showPics");
        my_div.appendChild(newList);
        my_div.style.display = 'none';
    }
    header.innerHTML = taskName;
    table.appendChild(header);

    header.innerHTML = taskName;
    table.appendChild(header);

    function addImage(col) {
        var img = new Image();
        img.src = "http://cdn.sstatic.net/stackoverflow/img/tag-adobe.png";
        col.appendChild(img);
        img.onclick = function () {
            my_div.style.display = 'block';

            allImages.onclick = function (e) { // I THINK THIS IS THE PROBLEM
                img.src = e.target.src;
                my_div.style.display = 'none';
                img.onclick=null;
            };
        }

    }

    for (r = 0; r < howOften; r++) {
        row = table.insertRow(-1);
        for (c = 0; c < numDays; c++) {
            col = row.insertCell(-1);
            addImage(col);
        }
    }

    document.getElementById('holdTable').appendChild(table);
    document.getElementById('createChart').onclick=null;
}

questionAnswers(2)

yourAnswerToTheQuestion