bootstrap 手风琴在表格单元格中不起作用

Question

bootstrap 表格单元格内的 Bootstrap 手风琴功能在我从表格中提取代码后无法正常工作，有人可以看看并让我知道我在这里做错了什么。

附上代码如下。

<div  class="container-fluid">
        <form method="post">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th scope="col">col1</th>
                            <th scope="col">col2</th>
                            <th scope="col">col3</th>
                            <th scope="col">col4</th>
                            <th scope="col">col5</th>
                            <th scope="col">col6</th>
                            <th scope="col">col7</th>
                            <th scope="col">col8</th>
                            <th scope="col">col9</th>
                            <th scope="col">col10</th>
                            <th scope="col">col11</th>
                        </tr>
                    </thead>

                    {% for lstelm in setup_all_config %}
                    <tr>
                        {% for elm in lstelm %}
                        {% if loop.index == 1 %}
                        <td>
                            <div class="accordion" id="accordionExample">
                                <div class="accordion-item">
                                  <h2 class="accordion-header" id="headingOne">
                                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                      Item #1
                                    </button>
                                  </h2>
                                  <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                    <div class="accordion-body">
                                    first
                                    </div>
                                  </div>
                                </div>
                              </div>
                        </td>
                        {% elif loop.index == 11 %}
                        <td><a type="button" class="btn btn-success">{{elm}}</a></td>
                        {% else %}
                        <td>{{elm}}</td>
                        {% endif %}
                        {% endfor %}
                    </tr>
                    {% endfor %}

                </table>
           
            </br>
        </form>
    </div>