CODEWITHSUNDEEP
javascriptjquerydom
jakeisonline
jakeisonline

Reputation: 1206

jQuery hover() event on div element within a button element

I can't seem to get jQuery to notice the div within the following markup

<button class="button submit positive right" id="omnisubmit" type="submit">
    <div class="label">Submit</div> 
    <div class="controller">&nbsp;</div>
</button>

And here is the jQuery I'm currently using:

$("button#omnisubmit div.controller").hover(function () {
            console.log("Hover...");
        });

However, jQuery doesn't seem to pick up when the mouse is hovering over that div, $("button#omnisubmit div.controller").hover(... works correctly, of course.

I have a feeling it's because putting divs inside buttons may not be standard HTML?

Upvotes: 1

Views: 507

Answers (1)

PetersenDidIt
PetersenDidIt

Reputation: 25620

Sounds like what you really should do is have two button elements that are styled to look like one.

Something like the jQuery UI Button element split button example.

Upvotes: 1

Related Questions