Applying effects to dynamic content
Hi all! I'm new to jquery and to the forum so bare with me.
I'm attempting to print a column of links received via AJAX request with an accompanying simple hover effect, however I can not get the hover effect to apply to the dynamic content. I've tried a few different ways of accomplishing this, none of which have worked so far. The most recent is posted below.
The call to imgUpdate.php in the following code snip returns content like:
-
<a class='storyImage' href='http://link.com/dev/?p=50'><img src='http://link.com/img1.JPG'/></a><br />
<a class='storyImage' href='http://link.com/dev/?p=47'><img src='http://link.com/img2.JPG'/></a><br />
-
$(document).ready(function() {
$("#images").load("imgUpdate.php",
"sid=6&images=2",
$("a.storyImage").hover(function() {
$(this).fadeOut(100);
$(this).fadeIn(100);
})
);
});
Extra Info:
- The body of the HTML contains an empty <div id="images">
- Hardcoding an <a> tag with id storyImage produces the effect.
Any help on how to make this work or suggestions on better ways to accomplish this are appreciated.
Thanks!