Html – When I switch to Tablet size or Mobile size,the button doesnot work how can i fix it?

<!-- Nav Bar -->
<nav class="navbar  navbar-expand-lg navbar-dark">
  <a class="navbar-brand" href="">tindog</a>
  <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-target="#navbarTogglerDemo02">
    <span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse " id="navbarTogglerDemo02">
  <ul class=" head navbar-nav ml-auto ">
      <li class="nav-item">
          <a class="nav-link" href="#footer">Contact</a>
      </li>
      <li class="nav-item">
          <a class="nav-link" href="#pricing">Pricing</a>
      </li>
      <li class="nav-item">
          <a class="nav-link" href="#cta">Download</a>
      </li>
  </ul>

I tried to change date-toggle and data-target but nothing changed
Bootstrap scripts for CSS and JS are Applied