Access several input with Jquery

For this you can simply search for the sibling element with class error-title , this is achieved with siblings () for later apply the hide() when the condition is true and show() when not.

In addition, you must delete the class hidden in each paragraph so that in principle they all appear and add the class entrada with which we assign the listener. (Ahem, use show and hide, but you could have also done with addClass and removeClass)

$(".entrada").on('input', function() {
    if((($(this).val().length)) > 0) {
      $(this).siblings('.error-title').hide();
    }
    else{
      $(this).siblings('.error-title').show();
    }
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
    <input type="text" class="form-control entrada" id="lastname" name="lastname">
    <p class="error-title" id="error-lastname">Lastname</p>
</div>
<div class="form-group">
    <input type="text" class="form-control entrada" id="name" name="name">
    <p class="error-title" id="error-name">Name</p>
</div>
<div class="form-group">
    <input type="text" class="form-control entrada" id="age" name="age">
    <p class="error-title" id="error-age">Age</p>
</div>

For that you would need to see which of the input is the one that changes, and with this , you would apply the property to the specific one, it would look like this:

I suppose you have all three inputs in some div as a container

<div id="contenedor">

    <div class="form-group">
        <input type="text"class="form-control" id="lastname" name="lastname">
        <p class="error-title hidden" id="error-lastname"></p>
    </div>
    <div class="form-group">
        <input type="text"class="form-control" id="name" name="name">
        <p class="error-title hidden" id="error-name"></p>
    </div>
    <div class="form-group">
        <input type="text"class="form-control" id="age" name="age">
        <p class="error-title hidden" id="error-age"></p>
    </div>

</div>

now with jquery , you would use the same as you have implemented, but for the input of the container:

$("#contenedor input").on('input', function() {
    if((($(this).val().length)) > 0) {
        $('#error-nombre').addClass('hidden');
    }
});

This way it will be useful for when it is written in any of the input of the container. Greetings

  

Note: If you add more input in the container in the future, the code will still work and you do not have to add more code

You can use multiple selector and use closest ()

$("#lastname, #name, #age").on('input', function() {
    if((($(this).val().length)) > 0) {
        $('#lastname').
        closest( ".error-handler" ).
        addClass('hidden');
    }
});

But to your html you have to add the erro handler as a class and repeat it

I hope I help you.