Question

I am almost done with a mockup and I need a little trick over this:

<form>
    <div class="line">
        <label>Embarque:</label>
        <select>
        <option value="first">Selecione a Estação</option>
            <option value="second" >Trianon-Masp | Linha 2 - Verde</option>
        </select>
        <div class="error">Selecione a estação de embarque</div>
    </div><!-- end line -->
</form>

When the user select the second option, the .error will fadeOut(); anyone got any idea how to roll about it?

Answer 1

Give an id for the <select> tag.

<select id="lineSelect">

Use this:

$("select#lineSelect").change(function(){
    if ($(this).val() == "correct")
        $(".error").fadeOut();
});

Or, you can use:

$(".line select").change(function(){
    if ($(this).val() == "correct")
        $(".error").fadeOut();
});