Build a Set of Football Team Cards - Build a Set of Football Team Cards

JavaScript
1

Tell us what’s happening:

Its working but Test 11- All players, and Test 14- defender is not passing.

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */

const footballTeam = {
  team: "India",
  year: 2025,
  headCoach: "Benito Montalvo",
  players: [
    {name: "Gurmeet Singh Chahal",
    position: "goalkeeper",
    isCaptain: false
    },
    {name: "Rahul Bheke",
    position: "defender",
    isCaptain: false
    },
    {name: "Anwar Ali",
    position: "defender",
    isCaptain: false
    },
    {name: "(Captain) Sandesh Jhingan",
    position: "defender",
    isCaptain: true
    },
    {name: "Ashish Rai",
    position: "defender",
    isCaptain: false
    },
    {name: "Ayush Chhetri",
    position: "midfielder",
    isCaptain: false
    },
    {name: "Udanta Singh Kumam",
    position: "midfielder",
    isCaptain: false
    },
    {name: "Lalengmawia Ralte",
    position: "midfielder",
    isCaptain: false
    },
    {name: "Ashique Kuruniyan",
    position: "midfielder",
    isCaptain: false
    },
    {name: "Sunil Chhetri",
    position: "forward",
    isCaptain: false
    },
    {name: "Lallianzuala Chhangte",
    position: "forward",
    isCaptain: false
    },
    {name: "Manvir Singh",
    position: "forward",
    isCaptain: false
    },
  ]
}

const team = document.getElementById("team");
team.innerText = footballTeam.team;
const year = document.getElementById("year");
year.innerText = footballTeam.year;
const headCoach = document.getElementById("head-coach");
headCoach.innerText = footballTeam.headCoach
const playersPosition = footballTeam.players.position;
const selector = document.getElementById("players");

function filterPlayer(position) {
  if (position === "all") return footballTeam.players;

  return footballTeam.players.filter(player =>
    player.position === position
  );
}

const container = document.getElementById("player-cards")

selector.addEventListener("change", (e) => {
  const selectedPosition = e.target.value;
  const filteredPlayers = filterPlayer(selectedPosition);

  let cardContainer = "";
  filteredPlayers.forEach(player => {
    cardContainer += `
      <div class="player-card">
        <h2>${player.name}</h2>
        <p>Position: ${player.position}</p>
      </div>
    `;
  });

  container.innerHTML = cardContainer;
});

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36

Challenge Information:

Build a Set of Football Team Cards - Build a Set of Football Team Cards

2

double check user story 11, there is something you are not doing that is making the tests not recognise some cards

4

Thankyou :folded_hands: , I wasn’t checking for isCaptain.