quiz.js

const quizData = [
  { q: "HTML stands for?", a: ["Hyper Text Markup Language", "High Text Machine Language", "Hyper Transfer Markup"], correct: 0 },
  { q: "Which tag is used for CSS?", a: ["<css>", "<style>", "<script>"], correct: 1 },
  { q: "JavaScript is?", a: ["Backend", "Frontend", "Both"], correct: 2 },
  { q: "Which one is not a programming language?", a: ["Python", "HTML", "Java"], correct: 1 }
];

let index = 0;
let score = 0;

function loadQuestion() {
  const q = quizData[index];
  document.getElementById("question").innerText = q.q;

  const options = document.getElementById("options");
  options.innerHTML = "";

  q.a.forEach((text, i) => {
    options.innerHTML += `
      <button class="btn btn-outline-primary w-100 mb-2" onclick="checkAnswer(${i})">${text}</button>
    `;
  });
}

function checkAnswer(choice) {
  if (choice === quizData[index].correct) {
    score++;
  }
}

function nextQuestion() {
  index++;
  if (index < quizData.length) {
    loadQuestion();
  } else {
    localStorage.setItem("webdevScore", score);
    localStorage.setItem("webdevCompleted", "true");

    document.querySelector(".course-card").innerHTML = `
      <h4>Quiz Completed 🎉</h4>
      <p>Your Score: ${score}/${quizData.length}</p>
      <a href="certificate.html" class="course-btn mt-3">Get Certificate</a>
    `;
  }
}

loadQuestion();