title: Using JQuery to replace multiple instances of HTML on one page
body: <p>I've made a script which copies the <code>alt</code> attribute of an image and puts it into a <code>&lt;span&gt;</code>. It also formulates the information divided by a hyphen. It works like a charm, but only with one image.</p>
  <p>I would also like to wrap a <code>&lt;div&gt;</code> around the image to prevent unnecessary markup.</p>
  <h3>Script snippets:</h3>
  <p><strong>HTML:</strong></p>
  <pre><code>&lt;div id=&quot;hoejre&quot;&gt;
      &lt;p&gt;
           &lt;span class=&quot;alignright&quot;&gt;
               &lt;img src=&quot;tommy_stor.jpg&quot; alt=&quot;Name - Title&quot; 
                    width=&quot;162&quot; height=&quot;219&quot; /&gt;
               &lt;span&gt;&lt;/span&gt;
           &lt;/span&gt;
     &lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  <p><strong>jQuery:</strong></p>
  <pre><code>var alt = $(&quot;#hoejre p span img&quot;).attr(&quot;alt&quot;);
  $('#hoejre p span span')
   .html(&quot;&lt;strong&gt;&quot; + alt.replace(&quot;-&quot;, &quot;&lt;/strong&gt; &lt;em&gt;&quot;) + &quot;&lt;/em&gt;&quot;);
  </code></pre>
  <p><strong>Output:</strong></p>
  <pre><code>&lt;span class=&quot;alignright&quot;&gt;
      &lt;img height=&quot;219&quot; width=&quot;162&quot; alt=&quot;Name - Title&quot;                  
           src=&quot;tommy_stor.jpg&quot;&gt;
          &lt;span&gt;
              &lt;strong&gt;Name&lt;/strong&gt;&lt;em&gt;Title&lt;/em&gt;
          &lt;/span&gt;
  &lt;/span&gt;
  </code></pre>
  <p>How do you I repeat the effect on several images, with different information within?</p>