Reposition error message on jquery validate plugin

Question

How can I realign the error message that the jQuery validate plugin (http://bassistance.de/jquery-plugins/jquery-plugin-validation/) produces when nothing is checked. I would ideally like to position it underneath the check-boxes rather right next to it all. Here is the code:

<script> $(document).ready(function() {
    $("#form1").validate();
    $("#form2").validate({
        rules: {
            "option[]": {
                required: true,
                minlength: 1
            }
        }
    });
}); 
</script>
                  <form action="#" name="form2" id="form2">
<input type="checkbox" name="option[]" value="DataProject"/>
DataProject
</label>
<br />
<label>
  <input type="checkbox" name="option[]" value="DC control" />
  DC control</label>
<label><br />
  <input type="checkbox" name="option[]" value="Computher" />
  Computer</label>
<br />
<label>
  <input type="checkbox" name="option[]" value="OHP" />
  OHP</label>
<p> * Please check at least one

Answer 1

You could try using a <div> as errorElement :

$("#form2").validate({
    errorElement: 'div',
    rules: {
        "option[]": {
            required: true,
            minlength: 1
        }
    }
});​

Answer 2

You can also try setting the defaults like:

jQuery.validator.setDefaults({
    errorPlacement: function(error, element) {
        if(element.attr('name') == 'm2'){
            error.insertAfter('small#m2_desc');
            error.css('display', 'none');
            error.css('color', 'red');
            error.fadeIn();
        }
    }
});

for a html like:

<div class="rowElem">
                            <label for"m2">M2 a limpar</label>
                            <input type="text" name="m2" value="'.$m2.'"/><br/>
                            <small id="m2_desc">mín: 100; máx: 10000</small>
                        </div>

This is a working example from one of my projects.