Bootstrap 5 accordion with chevron up and down

1<section class="btc-accordion">
2  <!-- Container -->
3  <div class="container">
4    <h1 class="text-center text-white">Bootstrap 4 Accordion</h1>
5    <p class="text-center text-white">A Bootstrap 4 accordion with chevron up and down </p>
6    <hr> <br>
7    <!-- row -->
8    <div class="row">
9      <div class="col-md-12">
10        <div class="accordion mb-2" id="accordionExample">
11          <!-- Collapse one -->
12          <div class="card">
13            <div class="card-header" id="headingOne">
14              <a class="accordion-icon" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
15                <h5 class="py-2"> Collapsible Group Item #1 <span class="float-end"><i class="fas fa-angle-down"></i></span></h5>
16              </a>
17            </div>
18            <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
19              <div class="card-body">
20                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium vulputate. Id velit ut tortor pretium viverra suspendisse potenti nullam ac.
21              </div>
22            </div>
23          </div>
24          <!-- /Collapse one -->
25
26          <!-- Collapse Two -->
27          <div class="card">
28            <div class="card-header" id="headingTwo">
29              <a class="accordion-icon" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
30                <h5 class="py-2"> Collapsible Group Item #2 <span class="float-end"><i class="fas fa-angle-down"></i></span></h5>
31              </a>
32            </div>
33            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
34              <div class="card-body">
35                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium vulputate. Id velit ut tortor pretium viverra suspendisse potenti nullam ac.
36              </div>
37            </div>
38          </div>
39          <!-- /Collapse Two -->
40
41          <!-- Collapse Three -->
42          <div class="card">
43            <div class="card-header" id="headingThree">
44              <a class="accordion-icon" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
45                <h5 class="py-2">Collapsible Group Item #3 <span class="float-end"><i class="fas fa-angle-down"></i></span></h5>
46              </a>
47            </div>
48            <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
49              <div class="card-body">
50                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Egestas egestas fringilla phasellus faucibus scelerisque eleifend donec pretium vulputate. Id velit ut tortor pretium viverra suspendisse potenti nullam ac.
51              </div>
52            </div>
53          </div>
54          <!-- /Collapse Three -->
55        </div>
56      </div>
57    </div>
58    <!-- /.row -->
59  </div>
60  <!-- /.container -->
61</section>