jQuery .first-child syntax

Question

As a beginner I struggle with the jQuery syntax. I realize that the following code is NOT selecting the first-child (the div).

My question: Why is the syntax wrong and how should I select the div in the previous anchor element? Please can/will someone answer this simple questions for me or put me in in the right direction?

(I did search but I just can't find the answer.) Manny thanks in advance!

function hilight(a) {
$('a').prev().first-child.css({"backgroundColor":"#ffffff","color":"#000000"}); }

<div>
<a href="#" class="bttn"><div class="bttn">Button</div></a>
<a href="#" class="image" onmouseover="hilight(this)" onmouseout="normal(this)">
    <img src="imgage.png"/>
</a></div>

Answer 1

There are 2 problems

function hilight(a) {
    //use a as a variable reference & use .children() to find the first child
    $(a).prev().children(':first-child').css({
        "backgroundColor": "#ffffff",
        "color": "#000000"
    });
}

• .children()
• :first-child

Since you are using jQuery, prefer to use jQuery event handlers instead of using inlined handlers.

Demo: Fiddle

• mouseenter
• mouseleave
• hover