Hello, I am building a web application and because it has a layout. I don't want to have to create a seperate navigation bar for each page.

I am wondering if I can assign an active class to a link that gets clicked on my navbar which will keep the active class even after a page refresh.

html

<div id="navbar">
    <ul id = "main_nav">
        <li><%= link_to '', root_path, :class => "home" %></li>
        <li><%= link_to '', junklists_path, :class => "buy" %></li>
        <li><%= link_to '', post_junk_path, :class => "sell" %></li>
        <li><%= link_to '', contact_path, :class => "contact" %></li>
    </ul>
</div>

jquery

$("#main_nav li a").click(function(){
  $("#main_nav li a.active").removeClass('active');  
  $(this).stop().addClass('active');
})

What options do I have? Thanks in advance!