load tag content from another url page
<p>I would like to create a content slideshow to give a preview of a list of products.</p>

<p>Here is the working slideshow I had no problem to create:</p>

<pre><code>&lt;body&gt;
   &lt;script src="http://mysite.com/slideshow.php type="text/javascript"&gt;
      ...slideshow scripts here...
   &lt;/script&gt;

   &lt;div id="preview"&gt;
      &lt;a href="http://mysite.com/product1/productDetail"&gt;
         &lt;img class="imageElement" src="http://mysite.com/product1.jpg"&gt;
      &lt;/a&gt;

      &lt;a href="http://mysite.com/product2/productDetail"&gt;
         &lt;img class="imageElement" src="http://mysite.com/product2.jpg"&gt;
      &lt;/a&gt;

      ...more &lt;a&gt; &lt;/a&gt;
   &lt;/div&gt; 
&lt;/body&gt;
</code></pre>

<p>Site visitors can click the images to open up the product detail pages.</p>

<p>While the images are looping through, I would like to automatically display each image's "product ID" as well. The ID's are in the product detail pages (in the above  tags) which I don't know how to retrieve &amp; display correctly.</p>

<p>I tried the following but not functioning:</p>

<pre><code>&lt;div id="content"&gt;&lt;/div&gt;
&lt;script&gt;
  $("#content").load("http://mysite.com/product1/productDetail #productID",function(){
     var sample = $('productID).text();
     $('#content').text(sample);
     });
  });
&lt;/script&gt;
</code></pre>

<p>What did I do wrong?</p>

<p><em><strong>Update:</em></strong></p>

<p>I realized that the load was pointing at a static url so I changed the code to:</p>

<pre><code>&lt;script&gt;
   $("#preview a").each(function(index){
      var url = $(this).attr("href"); 
      $("#content").load(url+" #productID",function(){
        var sample = $("#productID").text();
        $("#content").text(sample);
      });
   });
&lt;/script&gt;
</code></pre>

<p>Still not working!!!</p>
