placement of Error Div of checkbox by Jqueryt

<form name="MovieSurvey" id="formId" action="page2.php" method="post">
    <fieldset id="q8">
        <legend class="Q8"></legend>
        <label class="question">What are your favourite genres of movies?<span>*</span>

        </label>
        <div class="fieldset content">
            <ul class="checkbox-grid">
                <li>
                    <input type="checkbox" name="q8[]" value="Action">
                    <label for="checkgenre[]">Action</label>
                </li>
                <li>
                    <input type="checkbox" name="q8[]" value="Adventure">
                    <label for="checkgenre[]">Adventure</label>
                </li>
                <li>
                    <input type="checkbox" name="q8[]" value="Comedy">
                    <label for="checkgenre[]">Comedy</label>
                </li>
                <li>
                    <input type="checkbox" name="q8[]" value="Animation">
                    <label for="checkgenre[]">Animation</label>
                </li>
                <li>
                    <input type="checkbox" name="q8[]" value="Drama">
                    <label for="checkgenre[]">Drama</label>
                </li>
                <li>
                    <input type="checkbox" name="q8[]" value="Romance">
                    <label for="checkgenre[]">Romance</label>
                </li>
        </div>
    </fieldset>
    <input class="mainForm" type="submit" name="continue" value="Save and Continue" />
</form>





$(document).ready(function () {

    $('#formId').validate({ // initialize the plugin
        rules: {
            "q8[]": {
                required: true,
            }
        },
        errorPlacement: function (error, element) {
            if (element.attr("type") == "checkbox") {
                error.insertAfter($(element).parents('div').prev($('.question')));
            } else {
                // something else
            }
        }
    });

});