Спойлеры открываются, но не закрываются

есть такой вот код на JAVASCRIPT с рабочими спойлерами, они открываются поочередно, но не закрываются, как исправить проблему. Пробывал менять classList на toggle - не вышло. Прошу помощи, заранее спасиб.

 
 // МОДАЛЬНОЕ ОКНО + СПОЙЛЕР //
 
document.addEventListener('DOMContentLoaded', () => {
    const mOpen = document.querySelectorAll('[data-modal]');
    if (mOpen.length == 0) return;  // если нет элементов управления всплывающими окнами, прекращаем работу скрипта

    const overlay = document.querySelector('.modal__overlay'),
        modals = document.querySelectorAll('.modal__body, .spoiler__body'),
        mClose = document.querySelectorAll('[data-close]');

    for (let el of mOpen) {
        el.addEventListener('click', function(e) {
            let modalId = el.dataset.modal,
                modal = document.getElementById(modalId);
            
            // закрытие спойлера при открытии другого
            if (modal.classList.contains("close_prev")) { modalClose(modal); }
                
            modalShow(modal);
        });
    }

    for (let el of mClose) {
        el.addEventListener('click', modalClose);   // регистрируются обработчик события нажатия на крестик
    }

    document.addEventListener('keydown', modalClose);   // регистрируются обработчик события нажатия на клавишу

    function modalShow(modal) {
        if (!modal.classList.contains("spoiler__body")) { // условие, при котором откл. оверлей для спойлеров
            overlay.classList.add('open');
        }
        modal.classList.toggle('open'); 
    }

    function modalClose(event) {
        if ( event.type != 'keydown' || event.keyCode === 27 ) {
            for (let modal of modals) {
                modal.classList.remove('open');
            }
            overlay.classList.remove('open');
        }
    }
    
})
.spoiler__body {
    position: absolute; width: 250px; height: 0; opacity: 1; visibility: visible; background: #BCC5C8; 
    border-radius: 4px; box-shadow: none; overflow: hidden; z-index: 2; box-shadow: inset 0 0 1px #888;
    transition: 0.3s all; -webkit-transition: 0.3s all; -moz-transition: 0.3s all; -ms-transition: 0.3s all;
}
.spoiler__body.open {height: auto; padding: 1em;}
 <a href="javascript:void(0)" data-modal="spoiler-1">spoiler-1</a>
 <div class="spoiler__body close_prev" id="spoiler-1">
    Содержимое spoiler-1
</div>

 <a href="javascript:void(0)" data-modal="spoiler-2">spoiler-2</a>
 <div class="spoiler__body close_prev" id="spoiler-2">
    Содержимое spoiler-2
    
    <a href="javascript:void(0)" data-modal="spoiler-3">spoiler-3</a>
    <div class="spoiler__body" style="position: relative!important;" id="spoiler-3">
        Содержимое spoiler-3
    </div>
</div>
<br><br>

<div class="modal__overlay" data-close=""></div>


Ответы (0 шт):