Customizing jQuery validate to pop-up error message over an icon

Question

Hello!

This might be a fundamental jQuery misunderstanding but I've got to ask...

I'm trying to get the jQuery.validate to display its error messages on qTip, a jQuery plugin for customizing tooltips. Specifically I want to get the tooltip to pop-up on mouseover of a little red "X" icon.

I can get the tooltip to popup over the form field using the following code:

$().ready(function() {
    // validate signup form on keyup and submit
    $("#signup").validate({
                errorPlacement: function(error, element) {
                    element.parent().parent().append('<div class="rederrorx"></div>');
                    element.qtip(
                    {
                        //qTip formatting and content code
                    });
        },

But to get the tooltip to pop up over a red x, I change element.qTip( to $(".rederrorx").qTip( and it doesn't work (no message/qTip initialized).

Has the concept of selectors just gone way over my head? Prob so. Or is the jQuery class selector not selecting anything because the append has yet to take place? Or...

Thanks! Emile

Answer 1

I replaced element.parent() with element.parents('.classname') in order to pinpoint the exact parent element I wanted. I'm assuming a plugin added nested divs without telling me. No other answers....

lo siento for the stupid question