查找特定标签的父项

Question

I'm using jQuery validator for a questionaire. I want to show the error message of a certain label behind the question (.vraag), but I can't get it to work.

How do I append the error to the parrent (with class vraag) of this .find( "label[for='" + element.attr( "id" ) + "']" )

This is the HTML:

<div><p class="vraag"><strong>Heb je behoefte aan meer contact met ?</strong></p>  


<label for="antwoord1"><input id="antwoord1" class="antwoord1" type="radio" name="antwoord1" value="Ja, ik vind het leuk om  te ontmoeten"  > Ja, ik vind het leuk om te ontmoeten</label><br>

<label><input class="antwoord1" type="radio" name="antwoord1" value="Ja maar alleen per mail" > Ja maar alleen per mail</input></label><br>

<label><input class="antwoord1" type="radio" name="antwoord1" value="Ja maar alleen telefonisch"  > Ja maar alleen telefonisch</label><br>

<label><input id="contactvoldoende" type="radio" name="antwoord1" value="Nee, ik vind het contact voldoende" > Nee, ik vind het contact voldoende <span class="contactvoldoendetekst">(je hoeft de rest van de vragen niet in te vullen)</span></label><br>

</div>

This is the jQuery:

// validate the form when it is submitted
    var validator = $("#enquete").validate({
        errorPlacement: function(error, element) {
            // Append error within linked label
            $( element )
                .closest( "form" )
                    .find( "label[for='" + element.attr( "id" ) + "']" )
                        .append(error);
        },
        errorElement: "span",
            });


jQuery.extend(jQuery.validator.messages, {
    required: " (geef een antwoord)"
});

Answer 1

//Add following scripts to your HTML file in head section

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>