Validación de formularios sin alert

[xfxstudios]

no se si es lo que buscar, pero prueba asi y adaptalo:

Código HTML:

<form onsubmit="return validar()">
            <table>
                <tr>
                    <td>
                        <label for="nombre">Nombre:</label>
                    </td>
                    <td>
                        <input type="text" id="nombre" name="nombre" onChange="validar(this.id);"/>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <div id="validacion_nombre" class="error"></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="apellidos">Apellidos:</label>
                    </td>
                    <td>
                        <input type="text" id="apellidos" name="apellidos" onChange="validar(this.id);"/>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <div id="validacion_apellidos" class="error"></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="edad">Edad:</label>
                    </td>
                    <td>
                        <input type="text" id="edad" name="edad" onChange="validar(this.id);"/>
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <div id="validacion_edad" class="error"></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="telefono">Telefono:</label>
                    </td>
                    <td>
                        <input type="text" id="telefono" name="telefono" onChange="validar(this.id);"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="submit">
                    </td>
                </tr>
            </table>
        </form>
 

Código Javascript:

function validar(X){
 
var ar = ["carlos","quintero","30","telefono"];
 
var valor = $("input[id="+X+"]").val();
 
var index = $.inArray(valor,ar);
 
if(index > -1){
 
    $("input[id="+X+"]").hide(500);
  $("#validacion_"+X).html("");
 
 
}else{
$("#validacion_"+X).html("No existe esa información");
$("#validacion_"+X).attr('class','noesta');
}
 
 
}
 

Código CSS:

.noesta{
  color:#fff;
  background-color:red;
}
 

MUESTRA: https://jsfiddle.net/xfxstudios/4q1fh3j8/