«If statement» in for loop имя класса undefined

Question

Каждая карта имеет имена классов «card player1card ________» или «card player2card _______», где пустое пространство - это случайное имя класса, выделенное из массива cardnames.

Я хочу, чтобы код проверял все карты, а для тех, которые являются картой игроков1, чтобы их класс был изменен на «card player1card», а затем обновленный класс из массива cardnames, и тот же для player2card.

Все переменные были предварительно определены.

Я получаю ошибку «Uncaught TypeError: Невозможно установить свойство„имя класса“неопределенных»

var cardsnames = ["recruitbuilder", "allwood", "cabin", "messhall", "mast", "captainsquarters", "schooner", "brig", "frigate", "shipballista", "ram", "crowsnest", "spoondrill", "reinforcements", "recruitgunman", "allgunpowder", "firebarrel", "fireship", "roundshot", "heavyshot", "swivelgun", "chainshot", "mortar", "barrage", "resupply", "smuggler", "blockade", "mutiny", "recruitmerchant", "allgold", "addwood", "addgunpowder", "addgold", "removewood", "removegunpowder", "removegold", "byzantinefire", "slaves", "mercenaries", "ironplating", "coercion", "ascension"]; 

var w; 
var allocatedcard; 
var card = document.getElementsByClassName("card"); 

for (w = 0; w < card.length; w++) { 
    if (document.getElementsByClassName("card")[w].className.match('player1card')) { 
     this.className = "card player1card"; 
     var allocatedcard = Math.floor(Math.random() * cardsnames.length); 
     this.className += " " + cardsnames[allocatedcard]; 
     updateimages();    
    } else if (document.getElementsByClassName("card")[w].className.match('player2card')) { 
     this.className = "card player2card"; 
     var allocatedcard = Math.floor(Math.random() * cardsnames.length); 
     this.className += " " + cardsnames[allocatedcard]; 
     updateimages();  
    } 
} 

Answer 1

Только для контекста, код в вопросе была бы функция внутри другой функции. Поэтому вместо этого я сделал это следующим образом:

var recruitbuilder = document.getElementsByClassName('recruitbuilder'); 
var f; 
var className = ""; 
var cardsnames = ["recruitbuilder", "allwood", "cabin", "messhall", "mast", "captainsquarters", "schooner", "brig", "frigate", "shipballista", "ram", "crowsnest", "spoondrill", "reinforcements", "recruitgunman", "allgunpowder", "firebarrel", "fireship", "roundshot", "heavyshot", "swivelgun", "chainshot", "mortar", "barrage", "resupply", "smuggler", "blockade", "mutiny", "recruitmerchant", "allgold", "addwood", "addgunpowder", "addgold", "removewood", "removegunpowder", "removegold", "byzantinefire", "slaves", "mercenaries", "ironplating", "coercion", "ascension"]; 
var allocatedcard = cardsnames[Math.floor(Math.random() * cardsnames.length)]; 

for (f = 0; f < recruitbuilder.length; f++) { 
    recruitbuilder[f].onclick = function() { 
     recruitbuilderfunc(p1); 
     displayvaluesp1(p1); 
     if (this.classList.contains('player1card') == true) { 
      className = "player1card"; 
     } else if (this.classList.contains('player2card') == true) { 
      className = "player2card"; 
     } 
     //this.className += " " + cardsnames[allocatedcard]; 

     this.className = "card " + className + " " + allocatedcard; 
     updateimages(); 
    } 
}