jQuery - conditionally append HTML

Question

I'm trying to append a picture of a magnify glass after each image within a div. And some of them are linked and in that case I would like it to append it after the </a> that follows the img tag.

How can I make:

<img src="a.jpg" .... />

turn into:

<img src="a.jpg"><img src="mag.gif" />

And:

<a href="...."><img src="a.jpg" .... /></a>

turn into:

<a href="...."><img src="a.jpg"></a><img src="mag.gif" />

Note that there might be linebreaks before and after the img tags.

How is that done?

Answer 1

You can use after method.

Insert content, specified by the parameter, after each element in the set of matched elements.

$('img').after('<img src="mag.gif"/>')