title: Issue setting active class with jquery, nodejs, express, bootstrap
body: <p>I have a express generator, node js application. I'm using bootstrap and jade  and having problems with setting the active state of the navigation bar.</p>
  
  <p>I have been trying to use some jquery but when I click the nav bar the active state changes and then quickly changes back (it's not persistent). Any ideas what I am missing here? Thanks!</p>
  
  <p>Here is my <code>layout.jade</code>
  </p>
  
  <pre><code>doctype html
  html
    head
      title= title
      meta(charset="utf-8")
      meta(http-equiv="X-UA-Compatible" content="IE=edge")
      link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css')
      link(rel='stylesheet', href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css')
    body
      .navbar.navbar-inverse.navbar-static-top(role='navigation')
        .container
          .navbar-header
            button.navbar-toggle(type='button', data-toggle='collapse', data-target='.navbar-collapse')
              span.sr-only Toggle navigation
              span.icon-bar
              span.icon-bar
              span.icon-bar
            a.navbar-brand(href='/') Home
          .collapse.navbar-collapse
            ul.nav.navbar-nav
              li
                a(href='/about') About
              if user
                li
                  a(href='/table') Table
                li
                  a(href='/logout') Logout
              else
                li
                  a(href='/login') Login
                li
                  a(href='/signup') Signup
        block content
  
        script(src='//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.min.js')
        script(src='//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js')
        script(type='text/javascript' src='/javascripts/index.js')
  </code></pre>
  
  <p>And here is <code>/javascripts/index.js</code></p>
  
  <pre><code>$(".nav a").on("click", function(){
    $(".nav").find(".active").removeClass("active");
    $(this).parent().addClass("active");
  });
  </code></pre>