Есть скрипт небольшой, при нажатии на вопрос, выплывает ответ, я хочу что бы при нажатии на вопрос, менялся фон вопроса, я это реализовал, но при нажатии на этот же вопрос, фон обратно не убирается, подскажите где поправить?
<div class="row">
<div class="col-lg-12">
<div class="question">
<span>Как заказать анонимно?</span>
<div class="bg-plus">
<div class="plus"></div>
</div>
</div>
</div>
</div>
<div class="answer">
Основная проблема, с которой сталкиваются пользователи, торгующие криптовалютами, заключалась в том, что у них было приложение для доступа ко всем из одного места. Основная проблема, с которой сталкиваются пользователи, торгующие криптовалютами, заключалась в том, что у них было приложение для доступа ко всем из одного места. Основная проблема, с которой сталкиваются пользователи, торгующие криптовалютами, заключалась
в том, что у них было приложение для доступа ко всем из одного места. Основная проблема, с которой сталкиваются пользователи, торгующие криптовалютами, заключалась в том, что у них было приложение для доступа ко всем из одного места. Основная проблема, с которой Основная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которойОсновная проблема, с которой
</div>
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
window.addEventListener('load', function () {
allClass(0.4); // время transition
function allClass(transition) {
var question = [].slice.call(document.querySelectorAll('.question'),0)
answer = [].slice.call(document.querySelectorAll('.answer'),0)
arrayHeight = [];
var props = function props(el) {
return el.getBoundingClientRect();
};
[].concat(_toConsumableArray(question)).forEach(function (e, i) {
arrayHeight[i] = props(answer[i]).bottom - props(answer[i]).top + 10 + 'px';
answer[i].style.height = '0px';
setTimeout(function () {
return answer[i].style.transition = transition + 's';
}, 50);
e.addEventListener('click', function () {
[].concat(_toConsumableArray(answer)).forEach(function (e, i) {
answer[i].style.height = '0px';
question[i].style.backgroundColor = '#fff';
question[i].style.color = '#000';
});
props(answer[i]).height == 0 ? answer[i].style.height = arrayHeight[i] : '';
question[i].style.backgroundColor = '#9e39a1';
question[i].style.color = '#fff';
});
});
}
}, false);