Question

What I’m trying to do:

jQuery checks for all: <div class="message-body">

However, another div called: <div class="message-body"> gets selected as well.

The code works as intended – but is including other divs with similar names.

How can I prevent jQuery from selecting these other elements?

Example can be seen here: http://jsfiddle.net/Z5HJE/

The top image should NOT work as a link.

The bottom image should be the only one to work as a link.

I’m not experienced in jQuery at all, but I needed this simple function for my site.

Thank you for reading.

Answer 1

I assume that you need to get img tags inside <div class="message-body">, so you can modify your javascript code to become:

$('.message-body').each(function ()
{
   $(this).find('img').each(function ()
   {
      var currImg = $(this);  // cache the selector
      currImg.wrap("<a target='_blank' href='" + currImg.attr("src") + "'/>");
   });
});