Переходы внутри сайта без перезагрузки на javascript history

<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
    <script>
    	$(function(){
    		doHistoryLogic();
	    	$('.dolink').click(function(e){
	    		e.preventDefault();
	    		$('.nav li').removeClass('active');
	    		$(this).parent().addClass('active');
	    		window.history.pushState($(this).attr('id'), "Title", $(this).attr('href'));
	    		doHistoryLogic();
	    	});
    	});
    	var doHistoryLogic=function(){
    		console.log(window.history);
	    	switch(window.history.state){
		    	case "home":
		    		$('.about,.contact').fadeOut();
		    		$('.home').fadeIn();
		    		break;
		    	case "about":
		    		$('.home,.contact').fadeOut();
		    		$('.about').fadeIn();
		    		break;
		    	case "contact":
		    		$('.about,.home').fadeOut();
		    		$('.contact').fadeIn();
		    		break;	
		    	default: $('.about,.contact').fadeOut();
		    		$('.home').fadeIn();
		    		break;	    		
	    	}
    	}
    </script>

<ul >
          <li class="active"><a href="#"' id='home'>Home</a></li>
          <li><a href="#" id='about'>About</a></li>
          <li><a href="#"  id='contact'>Contact</a></li>
        </ul>