Ajax will not allow proper css link style

Question

This is my problem ajax file. Also see my original css question here:. The current CSS link style only works on the first page and doesn’t go to another

How can I fix this Ajax code to start using my current link style for the current current page?

$("a.ajax-link").live("click", function(){ $this = $(this); var link = $this.attr('href'); var current_url = $(location).attr('href'); if( link != current_url && link != '#' ) { $.ajax({ url:link, processData:true, dataType:'html', success:function(data){ document.title = $(data).filter('title').text(); current_url = link; if (typeof history.pushState != 'undefined') history.pushState(data, 'Page', link); setTimeout(function(){ $('#preloader').delay(50).fadeIn(600); $('html, body').delay(1000).animate({ scrollTop: 0 },1000); setTimeout(function(){ $('#ajax-content').html($(data).filter('#ajax-content').html()); $('#ajax-sidebar').html($(data).filter('#ajax-sidebar').html()); $('body').waitForImages({ finished: function() { Website(); backLoading(); $('.opacity-nav').delay(50).fadeOut(600); }, waitForAll: true }); },1000); },0); } }); } return false; }); 

Answer 1

It seems to me that you just need to remove the current class from the previous <li class = "current"> and apply it to the current <a> tag, the parent <li> .

This can be done as follows:

 $("a.ajax-link").live("click", function(){ $this = $(this); var link = $this.attr('href'); var current_url = $(location).attr('href'); if( link != current_url && link != '#' ) { $.ajax({ url:link, processData:true, dataType:'html', success:function(data){ //code to apply current class to current li if($this.parent("div.logo").length == 0){ $("li.current").removeClass("current"); $this.parent("li").addClass("current"); } //code ends here document.title = $(data).filter('title').text(); current_url = link; if (typeof history.pushState != 'undefined') history.pushState(data, 'Page', link); setTimeout(function(){ $('#preloader').delay(50).fadeIn(600); $('html, body').delay(1000).animate({ scrollTop: 0 },1000); setTimeout(function(){ $('#ajax-content').html($(data).filter('#ajax-content').html()); $('#ajax-sidebar').html($(data).filter('#ajax-sidebar').html()); $('body').waitForImages({ finished: function() { Website(); backLoading(); $('.opacity-nav').delay(50).fadeOut(600); }, waitForAll: true }); },1000); },0); } }); } return false; });