How to keep my selected menu open in my side bar - html

Question

My html look's like this below and I am also using Bootstrap. I would like the menu to stay open on my sidebar, after i have selected it.
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<ul class="treeview-menu" id="submenu_toggle">
<li>
<a href="tickets.php">
<i class="fa fa-circle-o sub_menu_fa"></i>Inbox
</a>
</li>
<li>
<a href="tickets.php?status=assigned">
<i class="fa fa-circle-o sub_menu_fa"></i>Mine
</a>
</li>
<li>
<a href="tickets.php?status=overdue">
<i class="fa fa-circle-o sub_menu_fa"></i>Overdue
</a>
</li>
<li>
<a href="tickets.php?status=closed">
<i class="fa fa-circle-o sub_menu_fa"></i>Closed
</a>
</li>
</ul>

Answer 1

Since it's not a one page application, consider using this. You are required to load this js & css on every page in menu item.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="treeview-menu" id="submenu_toggle">
<li>
<a href="tickets.php">
<i class="fa fa-circle-o sub_menu_fa"></i>Inbox
</a>
</li>
<li>
<a href="tickets.php?status=assigned">
<i class="fa fa-circle-o sub_menu_fa"></i>Mine
</a>
</li>
<li>
<a href="tickets.php?status=overdue">
<i class="fa fa-circle-o sub_menu_fa"></i>Overdue
</a>
</li>
<li>
<a href="tickets.php?status=closed">
<i class="fa fa-circle-o sub_menu_fa"></i>Closed
</a>
</li>
</ul>
<script>
$( document ).ready(function() {
var url = window.location.href; //get current page url
$(".treeview-menu i").each(function() {
if (url == (this.href)) {
$(this).addClass("active"); //add active class to matched LIst item
}
});
});
</script>
<style>
.active{
border-bottom:1px solid red;
}

Answer 2

<script>
$(function() {
// for bootstrap 3 use 'shown.bs.tab', for bootstrap 2 use 'shown' in the next line
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
// save the latest tab; use cookies if you like 'em better:
localStorage.setItem('lastTab', $(this).attr('href'));
});
// go to the latest tab, if it exists:
var lastTab = localStorage.getItem('lastTab');
if (lastTab) {
$('[href="' + lastTab + '"]').tab('show');
}
});
</script>