How to append HTML to images using JQuery?

I am using Galleria and I need to wrap my images that Galleria puts into a slide with a link.

I was going to use this methodology: Give the <img> a bogus title= value and then app开发者_StackOverflow社区end a <a> tag around the <img>, drawing the link I need from the title= tag.

This is the code I've got so far.

$("img#gallery").this.title.appendTo("img#gallery") { });

I'm trying to get the script to loop through all of the images and append the html.

I also don't know if I should be using .appendTo or .before and .after

---

That approach will work. You're looking for the wrap function:

var title = $('#test').attr('title');

$('#test').wrap('<a href="'+title+'" />');

This $.each will let you iterate through a series:

<img src="" class="test" alt="test" title="http://www.google.com" />
<img src="" class="test" alt="test" title="http://www.yahoo.com" />

$.each($(".test"), function() {
    var title = $(this).attr('title');
    $(this).wrap('<a href="'+title+'" />');
});

---

You could just listen for a click on the entire thing and then figure out if an image was clicked and if so which image and then change the location object.

---

Use $.each to iterate through all the images you want to wrap and then use

$('img#gallery').wrap('<a href='whatever'>) 

to wrap it. It will automatically close the A tag.