Defining a Function to Match document array element to document value in Meteor

Question

I have been working on a meteor web app. I inserted a document into MongoDB.

questionsList.insert({ask: "When was the War of 1812", answer: "1812", possAnsw: ["1811", "1812", "1819", "1820", "1840"]})

I am looking to have a function match when a person chooses the correct answer out of the possible answers. The problem is that I am having a hard time accessing one value and matching it to a specific <li> tag.

Pseudo-code:

if (li.currentTarget == questionList.find({answer: 1}).fetch() {
       $(li.currentTarget).css("background-color", "yellow");
}

Essentially, this would highlight only if I clicked the right answer:

Template.questions.events({
      'click .answers':function(li) {

        $(li.currentTarget).css('background-color', "yellow").css("width", "fit-content");

      }

    });

Right now, it highlights each <li> element regardless if it matches the correct answer (i.e. "ask"). The problem is I cannot seem to find how to get the value of the "ask" key and match it to the li.currentTarget.

I have looked at a couple of the following articles to no avail:

Get particular element from mongoDB array

Retrieve only the queried element in an object array in MongoDB collection

Answer 1

if I get your question correctly, basically when user click an answer of question, the server will check if it is correct answer.. so, I think you should query the question not the answer

var currentQuestionObject = questionList.find({ask: "When was the war of 1812?"}).fetch()

if (li.currentTarget == currentQuestionObject.answer) {
   $(li.currentTarget).css("background-color", "yellow");
}