Jquery event on input change with specific class

Question

I need to trigger a function when an input text field with a specific CSS class is changed.

    <form class="form-horizontal" role="form" id="infoClient">
                                <div class="form-group">
                                    <label for="Input" class="col-md-2 col-sm-2 control-label greenIfNotEmpty">Prénom</label>
                                    <div class="col-md-4 col-sm-4">
                                        <div class="input-group">
                                            <input type="text" class="form-control" id="Input" placeholder="">
                                            <span class="input-group-addon">
                                                <i class="glyphicon  glyphicon-pencil"></i>
                                            </span>
                                        </div>
                                    </div>
                                    <label for="disabledTextInput" class="col-md-2 col-sm-2 control-label greenIfNotEmpty">Nom famille</label>
                                    <div class="col-md-4 col-sm-4">
                                        <div class="input-group">
                                            <input type="text" id="disabledTextInput2" class="form-control" placeholder="">
                                            <span class="input-group-addon">
                                                <i class="glyphicon  glyphicon-pencil"></i>
                                            </span>
                                        </div>
                                    </div>
                                </div>



    $('input[type='text']').change(function() { ... });

This works for every input field,

$('input[type='text'] .greenIfNotEmpty').change(function() { ... });

is not working.

Can anyone help me on this ?

Answer 1

I feel dumb, I've attached class to Label instead of Input. Thanks a lot everybody.

Answer 2

Try something like this, demo in FIDDLE

JS

$('input:text.red').on('keyup', function() {
    alert('hello red')
});

HTML

<input type='text' class='red'/><br/>
<input type='text' class='yellow'/>

CSS

.red{
    background-color:red
}

.yellow {
    background-color:yellow
}

Answer 3

Try remove space between input and class name like so :

$('input[type='text'].cssClass').change(function() { ... });