jQuery Animation on multiple items
<p>On the page i have multiple thumbs images, each has it's own id, generated by php.</p>

<p>I need to do the jQuery animation for each element.</p>

<p>I'm stuck here, how i can detect witch <code>thumb_id-??</code> the user is hovering, and animate it?</p>

<p>I know i can do two simple js function for onmouseover/out and pass the id.. but there is another method of doing it with jQuery?</p>

<pre><code>&lt;script&gt;
$(document).ready(function(){
    $('#thumb_id- ??? ').mouseover(function(){
                div = $('div.thumb-img-hover');
                div.animate({opacity: '1'}, 150);
    }).mouseout(function(){
                div.animate({opacity: '0'}, 150);
    });
});
&lt;/script&gt;
</code></pre>

<hr>

<pre><code>foreach($arr as $val){
    echo '  
    &lt;a class="group1" text="TESTING" title="" href="'.$baseurl.'uploads/'.$val["filename"].'"&gt;
    &lt;div class="thumb-img-container right"&gt;
    &lt;div class="thumb-img" style="position:relative;background:url(\''.$baseurl.'uploads/thumbs/'.$val["filename"].'\') no-repeat center center;background-size: cover;"&gt;
    &lt;div id="thumb_id-'.$val["id"].'" class="thumb-img-hover"&gt;&lt;a href="'.$baseurl.'index.php?action=image&amp;id='.$val["id"].'"&gt;test&lt;/a&gt;&lt;/div&gt;
    &lt;/div&gt;
    &lt;/div&gt;
    &lt;/a&gt;
    ';
}
</code></pre>
