Question

The folowing code shows my div implementation for a side menu.

<div class="top_link">
    <h3><a href="/dashboard/" class="dash_board_link">Dashboard</a></h3>
</div>
<div id="accordion" class="accordion_menu">
    <h3><a href="#section1">Hits</a></h3>
    <div class="content">
        <a href="/dailyhits/">Daily Hits</a>
        <a href="/tophundredurls/?page=1">Top 100 URL</a>
    </div>
</div>
<div class="bottom_link">
    <h3><a href="/userwatchlist">Watch Lists</a></h3>
</div>
<div class="bottom_link">
    <h3><a href="/twitterinsights">Twitter Insights</a></h3>
</div>
<div class="bottom_link selected">
    <h3><a href="/managedomain"> Manage Domain </a></h3>
</div>

Using jQuery I want to read the current URL and trim it to the format which is specified in the href attribute and if there’s match I want to add the selected part of the particular div element to the div class="xxx select". In order to do this I added the following jQuery code:

$(document).ready(function () {
    var pathname = window.location.pathname;
});

I dont know how to proceed further because um so new to jQuery.

Answer 1

Haven’t tried it yet but, something along these lings should work:

var pathname = window.location.pathname;
var pathPart = pathname.slice('.com/', '/'); // assuming this is the end of your url
$('#navigation a').click(function(){
    var url = $(this).attr('href');
    $('#navigation a').removeClass('active');
    if ( pathPart == url ) {
        $(this).addClass('active');
    }
});