animate child elements of div
<p>I am trying to animate images inside div#image1.I am having the following markUp.</p>

<pre><code> &lt;div id="images"&gt; 
     &lt;img src="Images/Blue%20hills.jpg" width="100px" height="100px" /&gt;
     &lt;img src="Images/Sunset.jpg" width="100px" height="100px" style="display:none;"/&gt;
     &lt;img src="Images/Sunset.jpg" width="100px" height="100px" style="display:none;"/&gt;
     &lt;img src="Images/Winter.jpg"width="100px" height="100px" style="display:none;"/&gt;
 &lt;/div&gt;
 &lt;ol id="paging"&gt;
     &lt;li&gt;&lt;a href="javascript:void(0);"&gt;1&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="javascript:void(0);"&gt;2&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="javascript:void(0);"&gt;3&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href="javascript:void(0);"&gt;4&lt;/a&gt;&lt;/li&gt;
 &lt;/ol&gt;
</code></pre>

<p>and i am trying to animate by </p>

<pre><code>  $('#paging ol li a').bind('click', function() {
            var text = $(this).text();

            $('#images img').get(text).animate({ width: '200px', height: '200px', opacity: 0 });
</code></pre>

<p>But it is throwing exception </p>

<pre><code>$("#images img").get(parseInt(text) - 1).animate is not a function
        });
</code></pre>

<p>How should i do this.
Please help.</p>
