Question

Ok so I have a form which uses the following css to colour the border:

input[type="text"] {
    border: 1px solid #ccc;
}

The problem I have is changing the border colour using another css class.
If I use the following I can change the border $("#div").css("border", "1px solid green");, but if i try to add another class to it via $("#div").addClass("good"); it doesnt change the border.
What the correct way to change the border colour using a css class ?

Thanks,

Answer 1

You should use an override to enforce that the style is applied:

.good { border-color: green !important; }

or

.good { border: 1px solid green !important; }

DEMO