Bootstrap 3 - 手动将活动类分配给标题导航项

I am using nav walker for bootstrap in wordpress.

I have added a Custom Nav item from admin panel under menus. That custom item has 3 sub pages, when I go to one of the pages under that custom item, the page link highlights and the class "active" applies but I want the custom nav item or parent nav item to be active also.

How can I do this?

I tried below code but this doesn't work

<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   if (currentLocation == "media-gallery/pictures"){
      $("#menu-item-140").addClass("active");
   }
});
</script>
<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   alert(currentLocation);
   // if (currentLocation == "media-gallery/pictures"){
   //    $("#menu-item-140").addClass("active");
   // }
});
</script>


<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   // alert(currentLocation);
   if (currentLocation == "/media-gallery/pictures"){
      $("#menu-item-140").addClass("active");
   }
});
</script>

:)

EDIT:

To clarify, this code is fully tested, and works, assuming your file is located at http://example.com/test/blank.php. Please note the leading slash.

<style>
    .active{
        background-color: red;
    }
</style>

<div id="menu-item-140">Make me red</div>

<script language="javascript">
$(document).ready(function(){
   var currentLocation = location.pathname;
   alert(currentLocation);
   if (currentLocation == "/test/blank.php"){
      $("#menu-item-140").addClass("active");
   }
});
</script>