Estoy creando un programa de clasificación para hechizos DnD que clasifica los 318 hechizos en 83 categorías diferentes. Tengo varias matrices que almacenan toda la información y sé cómo verificar si un elemento tiene una clase de una matriz.

Sin embargo, quiero ordenar los hechizos en función de varias etiquetas a la vez, por ejemplo, seleccionar la etiqueta Druida y la etiqueta Nivel 9 mostraría solo los hechizos con esas etiquetas, pero luego anular la selección del Nivel 9 mostraría todos los hechizos Druida. La cantidad de etiquetas elegidas puede subir o bajar constantemente, y lo que estoy buscando esencialmente es algo que pueda tomar todas las etiquetas seleccionadas (empujadas en una matriz) y verificar si todas esas etiquetas son clases en cada div elemento, mostrando solo los elementos que contienen todas las clases en la matriz de selección de etiquetas. Tal como está ahora, solo he podido lograrlo comprobando la primera etiqueta que seleccioné, y luego todo queda en blanco después de seleccionar una segunda clase.

Esto es lo que he probado:

 var selections = []; function showCards(e) { $(".spellCards > img").hide(); selections.push(classes[e]); for(var i = 0; i < 318; i++) { // I'm putting all of my attempts here at once, they weren't run at the same time. if(spellCard[i].classList.contains(selections)) { $(spellCard[i]).show(); } if(spellCard[i].classList.matches(selections)) { $(spellCard[i]).show(); ) if(spellCard[i].classList.contains.every(selection)) { // First tag works $(spellCard[i]).show(); ) if(selection.every(c=>spellCard[i].classList.contains(c))) { $(spellCard[i]).show(); ) if(spellCard[i].classList.contains(classes[e])) { $(spellCard[i]).show(); } } }