0

I am trying to implement a feature in my card game where pressing a button will create a new HTML element that contains the card. (In my HTML I am using a onclick event). With the following code I get both an error that says appendchild is not a function as well as cardResult is undefined. Does anyone know how to fix this?

function pickNewCard() {
let newCard = document.createElement('p');
newCard.innerHTML = cardResult.name;
document.getElementsByClassName('card').appendChild(newCard); }

The pick a card function does work in my previous function that only changes the same HTML element when the button is pressed:

function pickCard() {
let cardResult = deck[Math.floor(Math.random() * deck.length)];   
document.getElementById('card').innerHTML = cardResult.name;    
currentCard = cardResult; }
  • `.getElementsByClassName()` returns a **list** of elements. You have to iterate through the list and find the element to which you want to append the new card. – Pointy Aug 08 '21 at 13:35
  • 2
    Where did you define `cardResult` in `pickNewCard`? – Wais Kamal Aug 08 '21 at 13:36

0 Answers0