Untitled

<!DOCTYPE html>
<head>
</head>
<style>
li.active a {
  background-color: black;
  color: #fff;
}
</style>
<body>
<ul class="nav navbar-nav">
  <li><a href="index.php">Home</a></li>
  <li><a href="order.php">Order</a></li>
  <li><a href="#">Location & Hours</a></li>
  <li><a href="menu.php">Menus</a></li>
  <li><a href="reserve.php">Reservations</a></li>
  <li><a href="register.php">Register</a></li>
  <li><a href="login.php">Login</a></li>
  <li><a href="logout.php">Logout</a></li>
    <li><a href="test.php">Logout</a></li>
</ul>
<script
  src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script type="text/javascript">
$(document).ready(function(){
    var location = window.location.pathname;
    alert(location);
    var file = window.location.pathname.split('/').slice(-1)[0];
    console.log(file)
    $('.nav li a ').each(function(){
        var link = $(this).attr('href');
        if(link == file){
            $(this).closest('li').addClass('active');
        }
    });
});
</script>
</body>
</html>