CODEWITHSUNDEEP
javascriptarraysfor-loop
EGxo
EGxo

Reputation: 315

Assign element from array to each table cell

I have 25 table cells and an array that randomizes values. I want to assign each value to a cell from the table.

I think that my main issue is in the following line:

for (i = 0; i < tablecells.length; i++) { 
        tablecells.innerHTML = BingoSquares.pop();
    };

What is the mistake in the above loop? Rest of code is shown below just in case its needed.

Thank you in advance

var overlay = document.getElementById('loginoverlay');
var tablecells = document.getElementsByTagName('td');

BingoSquares=["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "1", "2", "3"];



function hideOverlay(){
    overlay.style.opacity = 0;
    setTimeout(function(){
        overlay.style.display = "none"; 
    }, 1000);
};

function newCard() {
    //shuffle array:
    BingoSquares.sort(function(){
        return Math.round(Math.random());
    });

    console.log(BingoSquares.pop());


    for (i = 0; i < tablecells.length; i++) { 
        tablecells.innerHTML = BingoSquares.pop();
    };

};

document.getElementById('newsubmit').onclick = function() {
    hideOverlay();
    newCard();
};

Upvotes: 0

Views: 43

Answers (1)

Peter B
Peter B

Reputation: 24222

You need to index the elements from the array, by using tablecells[i]:

tablecells[i].innerHTML = BingoSquares.pop();

Upvotes: 1

Related Questions