JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
<form class="verbFind" id="idv_Form" method="post" action="javascript:alert('Form Submitted');">
    <label for="idv_Pos">
        <input id="idv_Pos" class="v_ton" name="idv_Pos" data-val="true" type="checkbox" checked />
        <span>Positive</span>
    </label>
    <label for="idv_Mix">
        <input id="idv_Mix" class="v_ton" name="idv_Mix" data-val="true" type="checkbox" checked />
        <span>Mixed</span>
    </label>
    <label for="idv_Neg">
        <input id="idv_Neg" class="v_ton" name="idv_Neg" data-val="true" type="checkbox" checked />
        <span>Negative</span>    
    </label>
    <input id="idv_Find" type="submit" value="Find Now" />
</form>

CSS

label {
    display:block;
}

JavaScript

$.validator.addMethod('v_ton', function (value) {
    var isValid = $('.v_ton:checked').size() > 0;
    alert('validator running.  isValid: ' + isValid);
    return isValid;
}, 'Please select at least one tone.');

$('#idv_Form').validate({
    submitHandler: function (form) {
        alert('Form Validation OK.');
    },
    invalidHandler: function (form) {
        alert('Form Validation Invalid');
    }
});

// Added this for debugging:
//$('#idv_Form').submit(function(e) { alert('submit handler working.'); });