jQuery .load (or $.ajax) to get and set page title?

Question

So far...

$('#container').load(hash + ' #page','', function() { 
    $('#container').fadeIn('fast');
    document.title = $('#title').load(hash + ' #title').text();
    });

...doesn't work. Is there a better/correct way to do this?

FYI: -

• I've added the ID #title the tag (all pages/it's a PHP template).
• The container is .fade(ed)Out beforehand (less important)

Thanks in advance.

Answer 1

The problem is that, at the time you assign to document.title, the $('#title').load(hash + ' #title').text() might not have finished yet. Try setting the new document.title in the callback of that .load.

UPDATE

Try:

$('#container').load(hash + ' #page','', function() { 
    $('#container').fadeIn('fast');
    $('#title').load(hash + ' #title', '', function(data) {
        document.title = $(this).text();
        });
    });