如何用原生JS实现动态答题的对错答案颜色区分？

我正在用Jinja（搭配Python）+SQL+JavaScript做一个带动态题目的简易答题系统。作为新手，想实现点击后正确答案变绿、错误答案变红的效果。目前已经能实现不管点哪里，正确答案都会变绿，代码如下：

document.querySelector('[ id$="{{ question.correct_answer }}"]').style.backgroundColor="rgb(0, 221, 135)";

试了id$!=的写法但没用，也查过:not选择器，但大多是jQuery相关的内容，我还没学jQuery。想问怎么用原生JS实现「ID后缀不匹配{{ question.correct_answer }}的元素变红」？

相关代码说明 #

• 所有答案元素的ID为answer_a、answer_b这类格式；
• 数据库里的correct_answer和ID完全匹配，比如correct_answer是answer_d时，调用{{ question.correct_answer }}就能把对应元素设为绿色；
• HTML结构示例：<div class=question_answer id="answer_d" onclick="selecResposta()"> {{ question.answer_d }} </div> <br>，这些元素都在名为question_options的DIV里。

更新：
结合@connexo和@Vijay Hardaha的答案，我已经实现了需求，解决方案如下：

HTML部分

<div class=question_answer data-answer="answer_a"> {{ question.answer_a }} </div> <br> 
<!-- 其他答案元素格式类似 -->

JavaScript部分

function selecRightAnswer() {
    document.querySelector("[data-answer={{ question.correct_answer }}]").style.backgroundColor="rgb(0, 221, 135)";
}
function selectWrongAnswer() {
    const elements = document.querySelectorAll("div.question_answer:not([data-answer={{ question.correct_answer }}])");
    elements.forEach(function (element) {
        element.style.backgroundColor = "red";
    });
}

内容的提问来源于stack exchange，提问作者Tiivo