Alexandru Alexandru - 4 months ago 7
Javascript Question

Change color in jQuery

So far I have this code which helps users know if the password is spelled right, but I want to make the color of the texts green/red for match/do not match.

$(function() {

$("#txtConfirmPassword").keyup(function() {
var password = $("#txtNewPassword").val();
$("#divCheckPasswordMatch").html(password == $(this).val() ? "Passwords match." : "Passwords do NOT match!");
});

});

Answer

Use .css() to change color of text

$(function() {
$("#txtConfirmPassword").keyup(function() {
    var password = $("#txtNewPassword").val();
    if(password == $(this).val()) {
        $("#divCheckPasswordMatch").html("Passwords match.");
        $("#divCheckPasswordMatch").css("color","green"); 
    } else {
        $("#divCheckPasswordMatch").html("Passwords do NOT match!");
        $("#divCheckPasswordMatch").css("color","red");
    }  
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="txtNewPassword" />
<input type="text" id="txtConfirmPassword" />
<div id="divCheckPasswordMatch" />