Cropping Image on each div with the same class
<p>I am trying to crop an image inside a div with the same class. I am using the following code:</p>

<pre><code>&lt;script type="text/javascript"&gt;
var iu = $("div.postbody").find("img").attr("src");
iu = iu.substr(0, iu.indexOf('?')) + '?width=150&amp;height=150&amp;crop=1%3A1';
$("div.postbody").find("img").attr("src", iu);
&lt;/script&gt;
</code></pre>

<p>Below is the HTML markup:</p>

<pre><code>&lt;div class="postbody"&gt;
&lt;a href="#"&gt;&lt;img src="http://1stimg.jpg?width=300"&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="postbody"&gt;
&lt;a href="#"&gt;&lt;img src="http://2ndimg.jpg?width=300"&gt;&lt;/a&gt;
&lt;/div&gt;
</code></pre>

<p>Using the above snippet works and crops the original image from 300 to 150px but the problem is the 2ndimg.jpg is being replaced with 1stimg.jpg. Anyway to revise the code so that it runs on individual div?</p>

<p>Any help is greatly appreciated.</p>
