jQuery.load() retrieve page div by id in anchor link
<p>I have the following in my navigation menu:</p>

<pre><code>&lt;ul&gt;
  &lt;li&gt;&lt;a href="#" id="folio1"&gt;&lt;img src="img1.jpg" border="0" /&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#" id="folio2"&gt;&lt;img src="img2.jpg" border="0" /&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>Which calls the jQuery:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $("#folio1").click(function () { 
      $('#folioWrap').load('folio1.html');
    });

    $("#folio2").click(function () { 
      $('#folioWrap').load('folio2.html');
    });
&lt;/script&gt;
</code></pre>

<p>This should update the div #folioWrap but right now it's just showing up blank. So, I have 2 questions:</p>

<p>1 - Is there a fundamental problem with what I've got here that's causing the blank page load?</p>

<p>2 - Is there a way that I can write the jQuery so that I only need one instance and can instead pass all the info from the anchor link? That way I could have a huge number of links which reference a variety of pages instead of creating a jQuery ref for each and every one?</p>
