How can I apply a lightbox (prettyphoto) to all images in the content div?

Question

Hi,

I have a lightbox script installed and now I want to apply the script on every image within the content div. How can I achieve this?

My current JS code:

       <script type="text/javascript" charset="utf-8">
  $(document).ready(function(){
   $("a[rel^='prettyPhoto']").prettyPhoto();
  });
 </script>

The css/div I want it applied to:

div.post img {

I somehow can't get this to work, and my jQuery skills are non existent :)

Thanks in advance for any help :)

Answer 1

Uhh, maybe

$('div.post img').prettyPhoto();

Answer 2

Currently, you're finding all <a> tags with rel='prettyPhoto' and using the prettyPhoto() plugin on them.

You can apply the same methodology to your div.post img {selector, by doing something like:

$("div.post img").prettyPhoto();

All I did was change the JQuery selector to match the div css identifier you provided. So, prettyPhoto() will be applied to all elements in "div.post img".