script.js

const questions=[
    {
        question:" which is the largest animal in the world?",
        answers:[
            {text:"shark",correct:false},
            {text:"Tiger",correct:false},
            {text:"Blue Whale",correct:true},
            {text:"Giraffe",correct:false},
        ]
    },
    {
        question:" Who is the Prime Minister of India?",
        answers:[
            {text:"Narendra Modi",correct:true},
            {text:"Rahul Gandhi",correct:false},
            {text:"Joe Biden",correct:false},
            {text:"Dr. Rajendra prasad",correct:false},
        ]
    },
    {
        question:" Which is the smallest continent in the world?",
        answers:[
            {text:"Asia",correct:false},
            {text:"Africa",correct:false},
            {text:"America",correct:false},
            {text:"Australia",correct:true},
        ]
    },
    {
        question:"Which is the largest dessert in the world?",
        answers:[
            {text:"Kalahari",correct:false},
            {text:"Sahara",correct:true},
            {text:"Thar",correct:false},
            {text:"Namib",correct:false},
        ]
    }


];
const questionElement=document.getElementById("question");
const answerButtons=document.getElementById("answer-buttons");
const nextButton=document.getElementById("next-btn");

let currentQuestionIndex=0;
let score=0;

function startQuiz(){
    currentQuestionIndex=0;
    score=0;
    nextButton.innerHTML="Next";
    showQuestion();
}

function showQuestion(){
    resetState();
    let currentQuestion=questions[currentQuestionIndex];
    let questionNo=currentQuestionIndex+1;
    questionElement.innerHTML=questionNo+"."+currentQuestion.question;


    currentQuestion.answers.forEach(answer=>{
        const button=document.createElement("button");
        button.innerHTML=answer.text;
        button.classList.add("btn");
        answerButtons.appendChild(button);
        if(answer.correct){
            button.dataset.correct=answer.correct;
        }
        button.addEventListener("click",selectAnswer);
    });  
}



function resetState(){
    nextButton.style.display="none";
    while(answerButtons.firstChild){
        answerButtons.removeChild(answerButtons.firstChild);
    }
}

function selectAnswer(e){
    const selectedBtn=e.target;
    const isCorrect=selectedBtn.dataset.correct==="true";
    if(isCorrect){
        selectedBtn.classList.add("correct");
        score++;
    }else{
        selectedBtn.classList.add("incorrect");
    }
    Array.from(answerButtons.children).forEach(button => {
        if(button.dataset.correct === "true" ){
            button.classList.add("correct")
        }
        button.disabled= true;
    });
    nextButton.style.display = "block";
}

function showScore(){
    resetState();
    questionElement.innerHTML=`You scored ${score} out of ${questions.length}!`;
    nextButton.innerHTML="Play Again";
    nextButton.style.display="block";
}

function handleNextButton(){
    currentQuestionIndex++;
    if(currentQuestionIndex < questions.length){
        showQuestion();
    }else{
        showScore();
    }
}

nextButton.addEventListener("click",()=>{
    if(currentQuestionIndex < questions.length){
        handleNextButton();
    }else{
        startQuiz();
    }
});

startQuiz();