Loading the result of a PHP script into a div from a link with JQuery
<p>I have been trying to load the content of a link to a div element without reloading the page. I found this solution 'http://wecodesign.com/demos/stackoverflow-7071545.htm' and have tried it but I couldn't get it to work. </p>

<p>What I am doing is exactly the same, but for some reason it doesn't work.</p>

<p>This is the Jquery part:</p>

<pre><code>&lt;script type="text/javascript"&gt;

    function updateContainer( url ){
        dynamicCon = '#mainContent';    
        ObjTag = $( dynamicCon );
        ObjTag.load( url );
    }
    $( document ).ready( function() {
        $( 'a[rel="dynamicLoad"]' ).bind( "click", function( event ) {
            url = $( this ).attr( 'href' );
            updateContainer( url );
            event.preventDefault();
            event.stopPropagation();
        });
    });
&lt;/script&gt;
</code></pre>

<p>And this is the PHP bit I use to output the HTML:</p>

<pre><code>echo '&lt;li&gt;&lt;a href = "/getPost.php?q='. $row['id'] .' " rel="dynamicLoad" &gt;'. $row['title'] .'&lt;/a&gt; &lt;/li&gt; &lt;br&gt;';
</code></pre>

<p>But this sends me to the link instead of loading it into the div. The div I want the content to load into is called "mainContent". Now, I can't say I know JQuery but everything looks OK to me but obviously I am missing something.</p>

<p>UPDATE: I tried linking to a later library, restart the server, cleared the browser cache and changed the Javascript to:</p>

<pre><code>        function updateContainer( url ){
            dynamicCon = '#mainContent';    
            ObjTag = $( dynamicCon );
            $("#mainContent").load(url)
        }
        $( document ).ready( function() {
            $( 'a[rel="dynamicLoad"]' ).bind( "click", function( event ) {
                url = $( this ).attr( 'href' );
                updateContainer( url );
                event.preventDefault();
                event.stopPropagation();
            });
        });
</code></pre>

<p>Now, when I try to load a link the mainContent div becomes empty (certainly an improvement considering the situation)</p>

<p>UPDATE 2: I uploaded the thing on the net if you want to poke around. electricbrownie.net</p>
