title: Add active class to navbar element when clicked
body: <p>I have created with navbar, I haven't done much web development.</p>
  <pre><code>&lt;nav class=&quot;navbar navbar-custom navbar-light navbar-expand-md justify-content-center&quot;&gt;
    &lt;button class=&quot;navbar-toggler ml-1&quot; type=&quot;button&quot; data-toggle=&quot;collapse&quot; data-target=&quot;#collapsingNavbar2&quot;&gt; &lt;span class=&quot;navbar-toggler-icon&quot;&gt;&lt;/span&gt; &lt;/button&gt;
    &lt;div class=&quot;navbar-collapse collapse justify-content-between align-items-center w-100&quot; id=&quot;collapsingNavbar2&quot;&gt;
      &lt;ul class=&quot;navbar-nav mx-auto text-center&quot;&gt;
        &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;index.html&quot;&gt;&lt;strong style=&quot;text-transform:uppercase&quot;&gt;home&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;about.html&quot;&gt;&lt;strong style=&quot;text-transform:uppercase&quot;&gt;about&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;flights.html&quot;&gt;&lt;strong&gt;FLIGHTS&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;hotels.html&quot;&gt;&lt;strong&gt;HOTELS&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;holidays.html&quot;&gt;&lt;strong&gt;HOLIDAYS&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item &quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;property.html&quot;&gt;&lt;strong&gt;PROPERTY&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li class=&quot;nav-item active&quot;&gt;&lt;a class=&quot;nav-link&quot; href=&quot;car_hire.html&quot;&gt;&lt;strong&gt;CAR HIRE&lt;/strong&gt;&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  <p>This navbar is linked to at the top of all other pages to reduce repetition of code. Can someone help me with code so when menu item clicked &quot;active&quot; class is added to li element. This then triggers css.</p>
  <p>CSS:</p>
  <pre><code>.nav-link.active {
    color: white;
  }
  </code></pre>
  <p>Thank you</p>