JQuery Validate checkbox row highlighting

I am trying to validate multiple checkboxes with JQuery validate. When less than 2 checkboxes are selected the row should be highlighted red, this works fine on the initial submssion and the user gets the error message with highlighted row or a tick if 2 or more are selected.

The problem is when the user changes there initial choice. I validate the form as the user moves though it so if the selection changes from 2 to 1 the row no should re-highlight which it doesn't seem to do, although the error message does update. Is there a way to add the error class back onto the row.

<li id="li_bit001" class="radiocheck checkboxShowHide">
<h2 class="label">Required Check box</h2>
<div>
<span>
<input name="chk_bit001" type="checkbox" id="chk_bit001" class="{required:true, minlength:2, messages:{required:'Please select atleast 2 checkbox'}}" /><label for="chk_bit001" class="width-xs">Yes</label>
</span>
<span>  
<input name="chk_bit001" type="checkbox" id="chk_bit002" /><label for="chk_bit002" class="width-xs">No</label>
</span> 
<span>
<input name="chk_bit001" type="checkbox" id="chk_bit003" /><label for="chk_bit003" class="width-xs">Maybe</label>
</span>
<span>                  
<input name="chk_bit001" type="checkbox" id="chk_bit004" /><label for="chk_bit004" class="width-xs">Whatever</label>
</span>
</div>
<span class="errorlabel"></span>
</li>

$("#form1").validate({
debug: true,
highlight: function(element, errorClass) {
$(element).closest('li').addClass('error-row');
},
unhighlight: function(element, errorClass) {
$(element).closest('li').removeClass('error-row');  
},
submitHandler: function() { return false; },
success: "valid",
errorPlacement: function(error, element) {      
error.appendTo(element.closest('li').find('.errorlabel'))}      
});