I am coding a javascript project for school and am having an issue with the initDeck function. I worked out a solution which worked in the developers console on chromes devtools but when I copy the code in atom and run it in chrome i get this error:

app.js:38 Uncaught TypeError: Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'. at initDeck (app.js:38) at :1:1

Here is my code: (i have all the variables initialized above.)

function initDeck(){ deck = document.getElementsByClassName('card1'); deckLength = deck.length; for(let i = 0; i < deck.length; i++){ card = deck[i]; deckIcon.push(card.firstElementChild); } shuffle(deckIcon);

for(let j = 0; j < deck.length; j++){ deck[j].removeChild(deck[j].firstElementChild); deck[j].appendChild(deckIcon[j]); } }

Here is the Full Code:

let deckIcon = []; let newDeckIcon = []; let match1, deckLength, cardOne, cardTwo, card, removeCard, addCard,test, test2; let matchCount = 0; let clicks = 0; let deck, moveNumber, showDeck, hideTimer1, hideTimer2;

document.addEventListener("DOMContentLoaded", function() { setEventListener()});

document.addEventListener("DOMContentLoaded", function() { initGame()});

/* * Display the cards on the page * - shuffle the list of cards using the provided "shuffle" method below * - loop through each card and create its HTML * - add each card's HTML to the page */

function initGame(){ hideAll(); resetScore();

}

function initDeck(){ deck = document.getElementsByClassName('card1'); deckLength = deck.length; for(let i = 0; i < deck.length; i++){ card = deck[i]; deckIcon.push(card.firstElementChild); } shuffle(deckIcon);

for(let j = 0; j < deck.length; j++){ deck[j].removeChild(deck[j].firstElementChild); deck[j].appendChild(deckIcon[j]); } }

// Shuffle function from http://stackoverflow.com/a/2450976 function shuffle(array) { var currentIndex = array.length, temporaryValue, randomIndex;

while (currentIndex !== 0) { randomIndex = Math.floor(Math.random() * currentIndex); currentIndex -= 1; temporaryValue = array[currentIndex]; array[currentIndex] = array[randomIndex]; array[randomIndex] = temporaryValue; }

return array; }

/*Code for the restart button*/ document.getElementById('resButton').addEventListener('click', function(){ initGame()});

/* * set up the event listener for a card. If a card is clicked: * - display the card's symbol (put this functionality in another function that you call from this one) * - add the card to a *list* of "open" cards (put this functionality in another function that you call from this one) * - if the list already has another card, check to see if the two cards match * + if the cards do match, lock the cards in the open position (put this functionality in another function that you call from this one) * + if the cards do not match, remove the cards from the list and hide the card's symbol (put this functionality in another function that you call from this one) * + increment the move counter and display it on the page (put this functionality in another function that you call from this one) * + if all cards have matched, display a message with the final score (put this functionality in another function that you call from this one) */

function setEventListener(deck){ document.querySelectorAll('li.card1').forEach(function(card){ card.addEventListener('click', function(){ if(!cardOne && clicks < 2){ cardOne = card; showCard(card); hideTimer1 = setTimeout(function(){hideCard(card)}, 2000); clicks++; } else if(!cardTwo && clicks < 2){ showCard(card); hideTimer2 = setTimeout(function(){hideCard(card)}, 1500); cardTwo = card; compare(cardOne, cardTwo); clicks++; setTimeout(function(){ clicks = 0; }, 3000); } }) }) }

function showCard(card){ card.classList.add('open'); card.classList.add('show'); }

function hideCard(card){ card.classList.remove('open'); card.classList.remove('show'); }

function compare(card1, card2){ if(card1.isEqualNode(card2)){ clicks = 0; matchCard(card1, card2); } else{ cardOne = null; cardTwo = null; matchCount++; scoreKeeper(); setTimeout(function(){ clicks = 0; }, 2000); } }

function matchCard(card1, card2){ card1.classList.add('match'); card2.classList.add('match'); cardOne = null; cardTwo = null; matchCount = 0; }

function scoreKeeper(){ switch(matchCount){ case 1: document.getElementById('star1').classList.add("hidden"); document.querySelector('span.moves').innerHTML = "4"; break; case 2: document.getElementById('star2').classList.add("hidden"); document.querySelector('span.moves').innerHTML = "3"; break; case 3: document.getElementById('star3').classList.add("hidden"); document.querySelector('span.moves').innerHTML = "2"; break; case 4: document.getElementById('star4').classList.add("hidden"); document.querySelector('span.moves').innerHTML = "1"; break; case 5: document.getElementById('star5').classList.add("hidden"); document.querySelector('span.moves').innerHTML = "0"; showAll(); break; } }

function showAll(){ showDeck = document.getElementsByClassName('card1'); clearTimeout(hideTimer1); clearTimeout(hideTimer2); for(let i = 0; i < showDeck.length; i++){ showAllCard = showDeck[i]; showAllCard.classList.add('open'); showAllCard.classList.add('show'); } }

function hideAll(){ showDeck = document.getElementsByClassName('card1'); for(let i = 0; i < showDeck.length; i++){ let showCard1 = showDeck[i]; if(showCard1.classList.contains('open')){ showCard1.classList.remove('open'); } if(showCard1.classList.contains('show')){ showCard1.classList.remove('show'); } if(showCard1.classList.contains('match')){ showCard1.classList.remove('match'); } } }

function resetScore(){ starList = document.getElementsByClassName('fa-star'); for(let i = 0; i < starList.length; i++){ starReset = starList[i]; starReset.classList.remove('hidden'); } document.querySelector('span.moves').innerHTML = "5"; matchCount = 0; }