Javascript表单验证与日期，不工作和表单提交无论如何

Question

function recurring_cb_fn(){
if( $("#recurring_yes").is(":checked") ){
    $("div#div_add_date").html("" +
    " <fieldset> " +
        " <legend> " +
            " Select Date of Venue " +
        " </legend> " +
        " <a href='#' id='add_date_fieldset' onclick='add_date()'>Add another date</a><br /><br /> " +
        " <input type='date' id='date_of_venue' name='date_of_venue[]' /> " +
            " <div class='add_date_for_venue'></div> " +
    " </fieldset> " );
}else if( $("#recurring_no").is(":checked") ){
    $("div#div_add_date").html("" +
    " <fieldset> " +
        " <legend> " +
            " Select Date of Venue: " +
        " </legend> " +
        " <input type='date' id='date_of_venue' name='date_of_venue' /> <br><br>" +
    " </fieldset> " );
}
}
function add_date(){
$("div#div_add_date").append("" +
" <fieldset> " +
    " <input type='date' id='date_of_venue' name='date_of_venue[]' /> " +
    " <a href='' id='remove_date_fieldset' name='remove_date_fieldset'><span class='el el-remove-circle'></span></a> " +
" </fieldset> " );
}

这是我用来允许用户添加多个日期的功能。我使用该名称在PHP中存储数组，但已经给它们所有相同的ID以在javascript中验证。日期必须在将来。这是我的验证码：

var date_of_venue = $("input#date_of_venue").val();

if( validate_date(date_of_venue) ){
  $("span.el").remove();
  $("input#date_of_venue").before("<span class='el el-ok'></span>");
}else{
  $("span.el").remove();
  $("input#date_of_venue").before("Date must be in the future <span class='el el-remove'></span>");
}

检查日期有效性的功能：

function validate_date(str) {
  var selectedText = str;
  var selectedDate = new Date(selectedText);
  var now = new Date();
  if (selectedDate < now) {
   alert("Date must be in the future");
   return false;
  }else{
   alert("Date is ok!");
   return true;
  }

表单不检查有效性，无论如何都要提交表单。 谢谢！