Jquery Add active class to parent class
<p>I want to make a navigation menu that will add active class when i click. Also, when child is clicked, its parent will add active class and remove the current active class(only one will be active). For example, when link 3 is clicked, link 2 and link 1 will not be active. When link 2.1 is clicked, only link 2 will be active. </p>

<pre><code>&lt;ul class="additional-menu"&gt;
&lt;li class="active"&gt;&lt;a href="#"&gt;Link1&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#" id="link2"&gt;Link2&lt;/a&gt;&lt;/li&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="#" id="link2.1"&gt;Link2.1&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;li&gt;&lt;a href="#" id="link3"&gt;Link3&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt; 
</code></pre>

<p>Jquery:</p>

<pre><code>$('.additional-menu').on('click','li', function(){
$(this).addClass('active').siblings().removeClass('active');

});
</code></pre>