JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
        <div id="timer"></div>
        <div id="flag-container" class="flag"><img src="" id="flag"></div>
        <div id="answer-buttons" class="answer-box">
            <button class="btn" id="answer-1" onClick="checkAnswer(this.id)">Country 1</button>
            <button class="btn" id="answer-2" onClick="checkAnswer(this.id)">Country 2</button>
            <button class="btn" id="answer-3" onClick="checkAnswer(this.id)">Country 3</button>
        </div>
        <div id="result" class="result"></div>
        <!-- <div class="answer-box"><button class="start-btn" id="start-button">Start >></button></div> -->
        <div class="answer-box"><button class="next-btn hide" id="next-button" onClick="generateNewGame()">Next flag >></button></div>
        <div class="score">Score: <span id="correct" class="score">0</span></div>
    </div>

JavaScript

const startButton = document.getElementById('start-button');
const nextButton = document.getElementById('next-button');
const answerButtons = document.getElementById('answer-buttons');


const flags = [
  { 
      image: 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png',
      country: 'Andorra',
  },
  { 
      image: 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png',
      country: 'United Arab Emirates',
  },
  { 
      image: 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png',
      country: 'Afghanistan',
  },
  { 
      image: 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png',
      country: 'China',
  },
  { 
      image: 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png',
      country: 'Chile',
  },
];

function generateChoosenFlags(flagSize = flags.length) {
	
  // [wrong, wrong, correctFlag]?
	let choosenFlags = [];
  
  let randomFlagIndex = getRandomFlagIndex();
  let randomFlag = getFlag(randomFlagIndex);
  swapFlags(randomFlagIndex, flagSize - 1)
  choosenFlags.push(randomFlag);

  randomFlagIndex = getRandomFlagIndex(flags.length - 1);
  randomFlag = getFlag(randomFlagIndex);
  swapFlags(randomFlagIndex, flagSize - 2)
  choosenFlags.push(randomFlag);
  
  randomFlagIndex = getRandomFlagIndex(flags.length - 2);
  randomFlag = getFlag(randomFlagIndex);
  swapFlags(randomFlagIndex, flagSize - 3)
  choosenFlags.push(randomFlag); 

	return choosenFlags;
}

function getFlag(index) {
	return flags[index];
}

function getRandomFlagIndex(flagSize) {
	if(!flagSize){
  	flagSize = flags.length;
  }
  
	return Math.floor(Math.random() * flagSize);
}

function swapFlags(indexFrom, indexTo) {
	const temp = flags[indexFrom];

	flags[indexFrom] = flags[indexTo];
  flags[indexTo] = temp;
}

function generateNewGame() {

 // If we wanted to prevent generating the same answer then we would change...