i need JavaScript for my sidebar menu active class in codeigniter

Question

Hi I am new to codeigniter this is my view

enter code here create_main_program"> Create Program myprogram"> My Program

            <li class="dropdown">
                <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">
                    My Profile
                        <span class="caret"></span>
                        <span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-user"></span>
                    </a>
                <ul class="dropdown-menu forAnimate" role="menu">
                        <li>
                            <a href="<?php echo  base_url(); ?>viewprofile">View Profile</a>
                        </li>
                        <li>
                            <a href="<?php echo  base_url(); ?>editprofile">Edit Profile</a>
                        </li>

                </ul>
            </li>
            <li>
                <a href="<?php echo  base_url(); ?>password">
                    Change Password
                    <span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-cog"></span>
                </a>
            </li>
            <li >
                <a href="javascript:;">
                    Premium Listing 
                    <span style="font-size:16px;" class="pull-right hidden-xs showopacity fa fa-usd"></span>
                </a>
            </li>
            <li >
                <a href="javascript:;">
                    Support
                    <span style="font-size:16px;" class="pull-right hidden-xs showopacity fa fa-question-circle"></span>
                </a>
            </li>
            <li >
                <a href="<?php echo base_url(); ?>homelogout" onclick="return confirm('Are you sure to logout?');">
                    Logout
                    <span style="font-size:16px;" class="pull-right hidden-xs showopacity glyphicon glyphicon-off"></span>
                </a>
            </li>

        </ul>

`

and my javascript is

$( document ).ready(function(){

var pathname = window.location.href;    //the url which displayed in the address bar. Ex. http://www.google.com/CreateUser
var partsArray = pathname.split('/');
var url = '/' + partsArray[4];     // after splitting the url the array will contains each part of the array starting from index 0
   alert(url);
var a_s = $('li');
a_s.removeClass('active');     //This removes active class of the previous li element
$('li a').each(function ()     // loop through all li element available in the page
{       
       // alert($(this).attr('href'));
    if ($(this).attr('href') == url)  //check whether the part of the URL and href of the current li elment is matching or not
    {
                $(this).addClass('active');   // add active class to the li element if it is matched
    } else{

    }
});   
});   

my sidebar.php is included in all pages so please help me to get sidebar selected menu active.

Answer 1

Try to change the loop with this

// loop the li not a
$('li').each(function ()     // loop through all li element available in the page
{       

    // alert($(this).attr('href'));
    //assign a to variable link 
    var link = $(this).find('a');

    if (link.attr('href') == url)  //check whether the part of the URL and href of the current li elment is matching or not
    {
        link.addClass('active');   // add active class to the li element if it is matched
    } else{

    }

});