I want to know if/how I can set custom validation. I’m working on a section to add items in a form, the user is asked if they would like to add an item, if they select yes, a section is made visible with all the input fields (description, value..) but the “add item”/“cancel” are <a> tags in a div and I haven't found a way to validate these like the rest of the inputs, instead I'm trying to see if the add/cancel div is visible (as this means the user didn't save the item details- when they select an option then the div is no longer visible). I’m looking for something along the lines of

$('form').validate(
    if ($(#add-or-cancel-div).is(':visible'){
        //validation = false
    }
)

I tried

$.validator.addMethod('itemRequiresAddOrCancel', function (element) {
    if (element.is(':visible')) {
        return false;
    } else { 
        return true;
    }}, "please pick an option");

$('form').validate(
    $(#add-or-cancel-div).rules('add', 'itemRequiresAddOrCancel');
    }
)

Is this the best way to approach this or can it be done another way?