javascript - 使用纯 JavaScript 单击 div 元素时删除或激活特定状态

Question

过去几天我提交了一个关于分页的问题（如何使用纯 JavaScript 在 css 中添加和删除活动状态），我得到了很好的答案。还有一些在同一个问题中，我只有在单击另一个 div 时才删除活动状态的问题。

let questions = document.querySelectorAll('.question__container'),
questionBar = document.querySelectorAll('#bar'),
questionClose = document.querySelectorAll('.paragraph__close'),
answers = document.querySelectorAll('.answers__container');

/* activeBar / activeAnswer */

function resetQuestions() {
    for (let i = 0; i < questions.length; i++) {
        questionBar[i].classList.remove('activeBar');
        answers[i].classList.remove('activeAnswer');
    }
}

function addActiveAnswer() {
    for (let i = 0; i < questions.length; i++) {
        questions[i].addEventListener('click', function() {
            resetQuestions();
            questionBar[i].classList.add('activeBar');
            answers[i].classList.add('activeAnswer');

            questionClose[i].addEventListener('click', function() {
                resetQuestions();
            });
        });
    }
}
addActiveAnswer();

我正在尝试构建所谓的问答页面，当用户单击问题时，答案会淡入下方，但是当单击关闭的 div 元素时，resetQuestions();不会执行。

提前感谢您的任何回答。

标签： javascripthtmlcss