Bootstrap accordion extended by default, how can I set them to collapsed instead?

Question

I am trying to implement some bootstrap accordions to an offcanvas nav bar, however, when I add them to the navbar and reload the website, they are all extended (open) by default and I want them to be collapsed (closed) instead. How can I do that? Code below.

<div class="offcanvas-body">
                    <ul class="navbar-nav justify-content-end flex-grow-1 pe-3">
                        
                        <!--one-->
                        <div class="accordion" id="accordionPanelsStayOpenExample">
                            <div class="accordion-item">
                                <h2 class="accordion-header" id="panelsStayOpen-headingOne">
                                    <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                        data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true"
                                        aria-controls="panelsStayOpen-collapseOne">
                                        DRAF Cases
                                    </button>
                                </h2>
                                <div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse in show"
                                    aria-labelledby="panelsStayOpen-headingOne">
                                    <div class="accordion-body">
                                        <ul class="accordion-list">
                                            <li class="accordion-link"><a class="accordion-href" href="/html/draf-sop.html">SOPs</a></li>
                                            <li class="accordion-link"> Blurbs </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>

Indentation may look odd due to copy-pasting!

Answer 1

put aria-expanded="true" to aria-expanded="false"

The aria-expanded attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not its child elements are displayed or hidden.

quote from developer.mozilla.org