forms - On change of hidden select option jQuery validation -

i have used tympanus natural language form plugin. in select option display:none , it's working ul li dropdown.

for validation, have used jquery validation plugin.

so on click submit button it's validating , class getting added target. on change of dropdown, class not getting removed. while on change hidden select option validating.

find image attachment below better understanding.

find js fiddle demo

i think, select option event not getting called in ul li dropdown. because if make visible select option , change by select option works fine.

$.validator.setdefaults({     onfocusout: true,        errorplacement: function(error, element) {         return false;     },     highlight: function(element){         $(element).addclass("errorhighlight-rrrr");         $(element).prev('.nl-field').addclass("errorhighlight");     },     unhighlight: function(element){         $(element).removeclass("errorhighlight-rrrr");         $(element).prev('.nl-field').removeclass("errorhighlight");     },     submithandler: function() {         $('.light').addclass('light_standactive');     },     ignore: []  });  $("#nl-form").validate({     rules: {          movies: "required",         restaurants: "required",         refuelled: "required",         fuelprice: "required",         groceries: "required",         clothes: "required",         equipment: "required",         equipmentprice: "required",         travel: "required"     },     messages: {      } });