jQuery unobtrusive validation and finding and hiding span

Question

this is my sample html

<td>
    <input type="text" value="1" name="Students[0].ID" id="Students_0__ID" data-val-required="The ID field is required." data-val-number="The field ID must be a number." data-val="true" title="Error...">
    <span data-valmsg-replace="true" data-valmsg-for="Students[0].ID" class="text-danger field-validation-error">
        <span for="Students_0__ID" class="">The ID field is required.</span></span>
</td>

I am finding span by class name field-validation-error and trying to hide.

also I want to get this message The ID field is required from nested span.

Here is my code which is not working. Not being able to find span field-validation-error.

Here is the code which I tried.

$.validator.setDefaults({
    highlight: function (element) {
        alert($(element).attr('id'));
        $(element).closest('.field-validation-error').hide();
        $(element).attr('title', 'Error...');   //do your custom error displaying here
    },
    unhighlight: function (element) {
        //hide your custom error here
        //alert($(element).attr('id'));
    },
    ignore: [],
});

this id Students[0].ID store into element. looking for help. thanks

Answer 1

Try substituting .next() for .closest()

$(element).next(/* selector */).hide();