Why my bootstrap collapse navbar won't work - html

Question

So im trying to create some navbar using bootstrap and make it able to collapse but it won't work
please help
This are my line of codes:
<nav class="navbar navbar-expand-md navbar-light bg-light sticky-top">
<div class="container-fluid">
<a class="navbar-brand" href="index.html"><img src="img/logo.png" alt="WebLogo"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarResponsive">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#" data-toggle="collapse" data-target=".navbar-collapse.show">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Service</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Team</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Location</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Connect</a>
</li>
<li class="nav-item">
<button type="button" class="btn btn-outline-secondary">Sign in</button>
</li>
</ul>
</div>
</div>
</nav>
Appreciate it for the help, thankyou

Answer 1

You must add jQuery and popper.js link or file to your project
jQuery
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap#4.5.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx"
crossorigin="anonymous"></script>
visit bootstrap document