jQuery Validate error message fadeIn/Out

I read lots of topic about that and i tried many things but It's strange I caot make it work... I would like when the validate error message displaying to display it with fadeIn effect. Then when the class has changed, mean that the form is valid, the error text should fadeOut..

FIDDLE

HTML :

<form id="MyForm">
    <select id="MySelect" name="select">
        <option value="">Select a value</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
    </select>
    <button id="MyButton" type="submit">Submit</button>
</form>

jQuery :

$(document).ready(function() {
    // Form Validate (Work if NiceSelect is desactivated 'bellow')
    $('#MyForm').validate({
        invalidHandler: function(element, form, validator) { 
        $(element.form).find("label[for=" + element.id + "]").hide().fadeIn("slow"); 
      },
        ignore: [],
        rules: {
            select: {
                required: true
            }
        },
        messages: {
            select: {
                required: "Value required"
            }
        },
        errorPlacement: function(error, element) {
            if (element.is('select:hidden')) {
                error.insertAfter(element.next('.nice-select')).fadeIn('4000');
            } else {
                error.insertAfter(element);
            }
        }
    });

    $('#MySelect').on('change', function() {
        $(this).valid();
    })

    // Activate NiceSelect (Validate doesn't work)
    $('#MySelect').niceSelect();
});

Any help would be appretiated

Thanks in advance