How to close Bootstrap menu when link is clicked?

Question

css

Good day!
There is a Bootstrap menu.
We need a script that will close the Bootstrap menu and return the background color of the button to the reverse color before it is clicked when clicking on any menu item, thanks in advance for the help!

<!-- Меню сайта -->
        <div id="menu">
          <nav class="navbar navbar-default">
              <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar">
                  <span class="sr-only">Toggle navigation</span>
                  <i class="fa fa-bars" aria-hidden="true"></i>
                </button>
                <div id="menu-text">
                    <a href="#head" data-target="anchor" class="navbar-brand visible-xs" ><p>Reco меню</p></a>
                </div>
                <div id="menu-height">
                    <a href="#head" data-target="anchor" class="navbar-brand hidden-xs"><p></p></a>
                </div>
              </div>
              <div id="navbar" class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="#benefits-h1" data-target="anchor"><p>НАШИ<br>ПРЕИМУЩЕСТВА</p></a></li>
                    <li><a href="#myft" data-target="anchor"><p>МУФТЫ</p></a></li>
                    <li><a href="#prais-contact" data-target="anchor"><p>ПРАЙС-ЛИСТ<br>КОНТАКТЫ</p></a></li>
                    <li><a href="#foto-slide" data-target="anchor"><p>ФОТО И<br>ВИДЕО</p></a></li>
                    <li><a href="#sertificat" data-target="anchor"><p>СЕРТИФИКАТЫ<br>КАЧЕСТВА</p></a></li>
                    <li><a href="#stanok" data-target="anchor"><p>РЕЗЬБОНАКАТНЫЙ<br>СТАНОК RECO-40C</p></a></li>
                </ul>
              </div>
            </nav>
        </div>

Answer 1

Try this one:

$(document).ready(function () {
        $(".navbar-nav a").click(function (e) {
            e.preventDefault();
            $('.navbar-collapse.show').collapse('hide');
        });
    });

Only this for 4 Bootstrap

Answer 2

About hiding the menu:
Impose the hidden attribute in the navbar on a variable, false by default, then when you click on the button, change the variable to true.
something like this:
button event:
onclick(){
hidden = !hidden;
}
Adjust to your architecture.