JQuery :: Adding A Div Class To An Active Li?

adding a class to an active li. I'm working in drupal, and the system adds a .active class to the DOM of whatever li class was last selected.In my .js file I added the following:

$('document').ready(function(){
var tabActive = $('#tabs-tabset ul.primary li.active a');
tabActive.addClass('tabknotch')
});

This works perfectly...for the first tab. when I navigate to the next tab the class does not change. I thought maybe there's a variable in the dom that is causing the class to not move, so I tried narrowing the div that it looks for and tried this:

$('document').ready(function(){
var tabActive = $('li.active a');
tabActive.addClass('tabknotch')
});

This achieved the exact same results...so there's obviously something I'm missing, but don't know what it is. If it's any help, here are two examples of the generated DOM that occurs when clicking on the active li. The first example is the div that has the class added, and the second is a div that does not have anything added. <li class="overview ui-tabs-selected active first tabknotch"><a href="#overview"><span class="tab">Overview</span></a></li> (this is the active tab where the jQuery succesfully adds the "tabknotch" class)<li class="features ui-tabs-selected active"><a href="#features"><span class="tab">Features</span></a></li> (this is the active tab that does not have the class added when clicked. When this li is active knotchtab remains on the other li that no longer has the .active class attributed)