Hello everyone.

My site currently loads content into a <div> with the id 'content'.
It does this by using PHP to dynamically include the content that the user requests.
My php looks like this:
PHP Code:
$pages = array('forside''menukort''hvemervi''Kontakt''catering');
            if (!empty(
$content)) {
in_array($content$pages)) {
$content .= '.php';
                else {
'Siden kunne ikke findes. Der må være sket en fejl! Gå tlbage til <a href="index.php">forsiden</a>';
        else {
my html for the menu that calls the pages looks like this:
HTML Code:
                    	<li><a href="index.php?content=forside">Forside</a></li>
                        <li><a href="index.php?content=menukort">Menukort</a></li>
                        <li><a href="index.php?content=hvemervi">Hvem er vi?</a></li>
                        <li><a href="index.php?content=catering">Catering</a></li>
                        <li><a href="index.php?content=Kontakt">Kontakt</a></li>
What I want to do is fade in the content that's called through these chunks of code. (Fade out old, fade in new)
I've then come the conclusion that using jQuery.AJAX is a good way to do this.
Further more I've learned that something like this needs to be done:
1. Find current content
2. Get the URL(part of content that i want)
3. fade out the old content;
4. fetch new content from the new url
5. Fade in new content.

My problem is that I don't quite know how to do this.
I've tried following this:
But the did not work.

Any help is very much appriciated.