jquery ajax load certain div

Question

my question is very simple how can I retrieve certain div with jquery ajax comand

$.ajax({
      url: \"test.html\",
      success: function(){
           $         


        

Answer 1

Here is an example that I use on my site for the navigation.

        
    
PORTFOLIO
    
BIOGRAPHY
 

For the javascript you can try this.

var hash = window.location.hash.substr(1);
var hash2 = window.location.hash.substr(1);

// Menu items to lower main content
var href = $('.ajax_nav').each(function(){
    var href = $(this).attr('href');
    if(hash==href.substr(0,href.length-4)){
        var toLoad = hash+'.html #ajax_content';
        $('#ajax_content').load(toLoad)
    }                                           
});

// For inner overlay of featured content. 
var href2 = $('.feat_item_link').each(function(){
    var href2 = $(this).attr('href');
    if(hash2==href2.substr(0,href.length-4)){
        var toLoadFeatured = hash2+'.html #ajax_featured_content';
        $('#ajax_featured_content').load(toLoadFeatured);
    }                                           
});

// For Bottom Navigation
$('#nav li a').click(function(){

    var toLoad = $(this).attr('href')+' #ajax_content';
    $('#content').hide('fast',loadContent);
    $('#load').remove();
    $('#wrapper').append('LOADING...');
    $('#load').fadeIn('normal');

    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href'));
    function loadContent() {
        $('#content').delay(1000).load(toLoad,'',showNewContent());
    }
    function showNewContent() {
        $('#content').show('normal',hideLoader());
    }
    function hideLoader() {
        $('#load').delay(1000).fadeOut('normal');
    }
    return false;
});

The id of #load simply uses an animated gif in the CSS.

Place the javascript in the $(document).ready() and you should be all set.