Kendo UI validator error message not correctly positioned

I'm trying to validate a contact form using KendoUI, but I have a problem with Kendo Validator, the validation message is not apearing where it should appear that is next to each field, it is appearing just next to the first field where I click when page loads, and when I click a different field, the validation message changes but not its position, it keeps next to the first field I click. I hope you can help me, thanks.

As you can see here, the span that should add the tooltip only appears in the element I click:

When in the Telerik's example it appears on every required element: This is basically the code I'm using:

<form action="contact.php" method="post" id="contact-form">
                <ul>
                    <li>
                        <label for="contact-name">Nombre: </label>
                        <input type="text" placeholder="Nombre completo" id="contact-name" required validationMessage="Nombre completo por favor">
                    </li>
                    <li>
                        <label for="contact-company">Empresa: </label>
                        <input type="text" placeholder="Empresa" id="contact-company">
                    </li>
                    <li>
                        <label for="contact-phone">Telefono: </label>
                        <input type="tel" placeholder="Telefono" id="contact-phone" required validationMessage="Numero de telefono por favor">
                    </li>
                    <li>
                        <label for="contact-name">Correo electronico: </label>
                        <input type="email" placeholder="Correo electronico" id="contact-email" data-email-msg="Email format is not valid">
                    </li>
                    <li>
                        <label for="contact-subject">Asunto: </label>
                        <input type="text" placeholder="Asunto" id="contact-subject" required validationMessage="Asunto por favor">
                    </li>
                    <li>
                        <label for="contact-message">Mensaje: </label>
                        <textarea id="contact-message" cols="30" rows="10" placeholder="Ingrese el mensaje que desea enviar" required validationMessage="Mensaje por favor"></textarea>
                    </li>
                    <li>
                        <input type="submit" value="Enviar">
                    </li>
                </ul>
            </form>

An the JS

$('#contact-form').kendoValidator();

This is basically the same code as in Telerik's example: KendoUI Validator example

The problem is that you define the validator at root form level ('#contact-form'). You should define it for each element:

$('input', '#contact-form').kendoValidator();