منوی آکاردئونی

سلام
من داخل سایتم یه سری پرسش و پاسخ دارم که حالت آکاردئونی هست
یعنی با کلیک بر روی سوال ، پنجره زیر سوال باز میشه و کاربر جوابش رو می بینه
همانند تصویر زیر

در این منو که دارم وقتی کاربر پنجره یه سوال رو باز میکنه و وقتی پنجره سوال بعدی رو باز میکنه،
هر دو پنجره باز می مونن
من میخوام وقتی پنجره بعدی رو باز کرد پنجره قبلی بسته بشه
این کد html ش هست

    <div class="container-fluid header bg-primary p-6 mb-5">
        <div class="row g-0 align-items-center flex-column-reverse flex-lg-row">

            <div class="col-md-15 pb-8 wow fadeInUp">
        <div class="rounde container">

        </div>
                    <div class="row2 g-7">
                <button class="accordion">سوال 1</button>
                    <div class="panel">
                        <p class= "title-1 py-7">جواب 1</p>
                        <p class= title-1>.</p>
                        <p class= title-1>.</p>
                    </div>

                <button class="accordion">سوال2</button>
                    <div class="panel">
                        <p class= "title-1 py-7">جواب 2</p>
                        <p class= title-1>.</p>
                        <p class= title-1>.</p>
                    </div>

                <button class="accordion">سوال3</button>
                    <div class="panel">
                        <p class= "title-1 py-7">جواب 3</p>
                        <p class= title-1>.</p>
                        <p class= title-1>.</p>
                    </div>

                </div>
        </div>
            </div>
         </div>
       </div>
   </div>

میدونم از کد جاوای زیر دستور میگیره

<script>
    var acc = document.getElementsByClassName("accordion");
    var i;

    for (i = 0; i < acc.length; i++) {
      acc[i].addEventListener("click", function() {
        this.classList.toggle("activ");
        var panel = this.nextElementSibling;
        if (panel.style.maxHeight) {
          panel.style.maxHeight = null;
        } else {
          panel.style.maxHeight = panel.scrollHeight + "px";
        } 
      });
    }
</script>

فکر میکنم با ویرایش کد جاوا درست بشه و من به منظورم برسم
اما چه ویرایشی؟