jquery Проверка не работает для проверочных дат

Question

Я изменяю существующий проект, в котором я хочу проверить дату начала (С) и дату окончания (До), используя jquery. Требуется, чтобы дата окончания (до) не могла быть меньше даты начала (с). Ниже мой код html, и я добавляю код jquery, который я написал. Но дата не подтверждена и не отображает никаких сообщений об ошибках. Как только я нажимаю кнопку «Отправить», она успешно отправляется без каких-либо ошибок. Я пишу следующий вопрос, чтобы написать часть jquery, но он не работает. Я действительно ценю, если кто-то может помочь мне решить эту проблему. Заранее спасибо.

Использование jquery Функция проверки «больше чем»

var validator = $("#add_cetificate").validate();

$("#valid_to").rules('add', { greaterThan: "#valid_from" });


 
 $.validator.addMethod('greaterThan', function(value, element, param){   
        var startDate =  $(param).val();
         var endDate = value ;
        return endDate > startDate;

 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>
<div class="form-group">
    <label for="" class="col-sm-2 control-label">Valid From<span class="star"> * </span></label>
    <div class="col-sm-3">
        <input type="text" class="form-control datepicker" name="valid_from[]" id="valid_from" required="required">
    </div>
    <label for="" class="col-sm-2 control-label"> To <span class="star"> * </span></label>
    <div class="col-sm-3">
        <input type="text" class="form-control datepicker" name="valid_to[]" id="valid_to" required="required">
    </div>
</div>