jquery validator, can't set class name correctly for error labels

Question

    var validator = $("#form1").validate({
        rules: {
            name: "required",
        },
        messages: {
            name: "Name Required",
        },
        submitHandler: mySubmitHandler,
        success: "valid",
        errorClass: "invalid"
    });

I have above code to add jquery validation in a form.

Problem: When input is invalid it adds 'invalid' class to error label. Then when valid it adds 'valid'. but when once it's invalid after valid, it does not remove valid class.

1> invalid - label has invalid class now

2> valid - label has 'invalid valid' class now

3> invalid - label has 'invalid valid' class now

am i missing some implementation or how it suppose to be used?

Only custom thing i am trying to implement is adding an image with error label using class.

Answer 1

(After reading the docs and searching for "errorClass"...)

Try adding the focusCleanup: true option to your validate() method; this should remove the errorClass as input fields are selected for editing.