[jQuery] Selectors and changing source of HTML-elements

[jQuery] Selectors and changing source of HTML-elements


Hi everyone, this is my first message to the jquery group, hope you
don't mind and i'll improve over time :)
My HTML is this:
<ul id="gallery">
<li>
<h2><a href="#targeturl">www.targetlink.com.whatnot</a> Title</h2>
<img src="thumb.jpg" alt="" />

Lorem impsum


</li>
First i'd like to find the IMG tag from every #gallery LI to apply a
hover function to the image inside the specifil ul that has been
hovered.
I tried different versions, and thought this one would be ok, but not
working....
$("#gallery li").hover(
    function(){
        $(this,"img").addClass("over")
    }
}
Secondly i'd like the heading H2 inside the LI to change when i hover
it, i got it partly working, it changes when i hover, but i'd like it
to return to it's original state after that. The code i use ise here:
$("#gallery li h2 a").hover(
    function(){
     $(this).replaceWith("<a href=#the_same_link_as_it_was_before>I am
the changed text</a>");
    },
    function () {
     $(this).replaceWith(this).text;
    }
)
and the last one i'm just puzzled with. I'd like to dynamically add a
DIV element to the inside of an UL, just before ending the ul tag (</
UL>) on mousover, which is quite easy, but i'd like to remove it on
mouseout...
My current code (which does nothing) goes like this:
    $("#gallery li").hover(
        function(){
            $(this).wrap('<span style="border:1px solid green;float:left;"></
span>')
            .parent()
            .append('<div id="divver"></div>')
        },
        function () {
            $(this).css('borderColor','red')
            /*just for testing*/
        }
    )
Thanks everyone for any guiding me in the right direction, I'm eager
to learn more about jquery every day!
Cheers,
V.