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