تغییر اکتیو شدن کلاس در منو

سلام چطوری در منوی زیر خاصیت class="active" مربوط به Li را با کلیک کردن روی آن تغییر استایل بدم؟

<!-- Sidebar -->
<div class="sidebar">
<div class="sidebar-content">
<!-- User dropdown -->
<div class="user-menu dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<img src="http://placehold.it/300" alt="" />
<div class="user-info">
<span>development</span>
</div>
</a>
</div>
<!-- /user dropdown -->
<!-- Main navigation -->
<ul class="navigation">
<li class="active"><a href="Default.aspx"><span>صفحه اصلی</span> <i class="icon-screen2"></i></a></li>
<li>
<a href="pg_DemandsListVosol.aspx"><span>لیست پرونده ها</span> <i class="icon-paragraph-justify2"></i></a>
<ul>
<li><a href="pg_DemandsManager.aspx">مدیریت پرونده ها</a></li>
<li><a href="pg_DemandsListVosol.aspx">لیست وصول</a></li>
<li><a href="pg_UserManager.aspx">مدیریت اعضا</a></li>
<li><a href="pg_LegalUnitAction.aspx">مدیریت حقوقی</a></li>
<li><a href="validation.html">Validation</a></li>
<li><a href="file_uploader.html">Multiple file uploader</a></li>
<li><a href="form_snippets.html">Form snippets</a></li>
</ul>
</li>
<li>
<a href="pg_UserManager.aspx"><span>مدیریت کاربران</span> <i class="icon-grid"></i></a>
<ul>
<li><a href="visuals.html">Visuals &amp; notifications</a></li>
<li><a href="navs.html">Navs</a></li>
<li><a href="panel_options.html">Panel options</a></li>
<li><a href="navbars.html">Navbars</a></li>
<li><a href="info_blocks.html">Info blocks</a></li>
</ul>
</li>
</ul>
</div>
</div>
<!-- /Sidebar -->

- - , .