> For the complete documentation index, see [llms.txt](https://docs.idew.org/code-trivia-app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.idew.org/code-trivia-app/code-template/template-build-tutorial/7.-respond-to-answer-clicks.md).

# 7. Respond to Answer Clicks

### When a Player Clicks an Answer

The `onClickedAnswer( )` function is called by the Trivia library when a button of *class* "answer-btn" is clicked. In the code below you will notice that a parameter, `isCorrect`, is "passed" to the function to indicate whether the answer is correct or not. Based on the answer we will provide appropriate feedback by inserting text and showing the "feedback" HTML element. We will also highlight the correct answer by adding a "highlight" class to the correct answer button. Finally, we will wait 3 seconds then use the trivia library method to `gotoNextQuestion`. **Update your function to match the one below.**

{% code title="JavaScript" %}

```javascript
function onClickedAnswer(isCorrect) {
  if (isCorrect) $("#feedback").html(`Way to go!`).show();
  else $("#feedback").html(`Better luck next time.`).show();
  $("#correctAnswer").addClass("highlight"); //highlight right answer
  setTimeout(trivia.gotoNextQuestion, 3000); //wait 3 secs...next question
}

```

{% endcode %}

In order for the button highlight to work you need to add the following to your CSS. **Add this to the bottom of your CSS.**

{% code title="CSS" %}

```css
.highlight {
  background-color: green;
  color: white;
}

```

{% endcode %}

If you run your trivia now the first question should respond nicely to a clicked answer, but you will notice a couple of problems once you get passed the first question. The highlight is stuck on and the feedback is not cleared. Let's fix that by adding two lines of code to your displayQuestion( ) function.

**Add the code below just after `$("#question-screen").show();` inside your displayQuestion( ) function.** This resets your feedback.

{% code title="JS" %}

```javascript
  $("#correctAnswer").removeClass("highlight");
  $("#feedback").hide();
```

{% endcode %}

Your trivia game should be clipping along well now. The final piece is to handle what happens when all questions have been answered.