Adding a class to input does not show it

Adding a class to input does not show it

I have a simple problem, i have made a html part with a class named toRed, defined like
.toRed {
            background-color: red;
}

and this is the script and the html (very simple).
    <script type="text/javascript">
        $(document).ready(function() {
            $("#btnIrRegistro").click(function() {
                $("#nombre").addClass("irARojo", 4000);
            });
        });
    </script>
    <title>JQuery Mobile Evaluacion Final</title>
</head>
<body>
    <div data-role="page" id="pagGestion">
        <div data-role="header">
            <h1>Gestion Hotel</h1>
        </div>
        <div data-role="content" class="ui-field-content">
            <label for="nombre">Nombre:</label>
            <input type="text" name="nombre" id="nombre">
            <a id="btnIrRegistro" class="ui-btn ui-btn-icon-right ui-icon-edit ui-corner-all">poner fondo rojo</a>
        </div>
        <div data-role="footer">
            <p align="center">Gestion Hotel</p>
        </div>
    </div>

now my question is, why when i press the btnIrRegistro, and i notice it reaches the add class
the class is added but the background of the button does not change.