Removing or altering CSS pseudo class in jQuery

Question

A simple enough question, so briefly - is it possible to remove or alter in anyway a CSS pseudo class using jQuery? Or any other Javascript method for that matter

Specifically I want to get rid of :focus on inputs. I can't alter the CSS file directly in any way.

thanks for any help

Buster

Answer 1

I can't alter the CSS file directly in any way.

Assuming you can only use JavaScript to do this, I can't think of anything better than:

$('head').append('<style>input:focus{background:#fff}</style>');

You will have to individually reset each property. font-weight:normal, color:#000 - whatever you need.

See: http://jsfiddle.net/jqpAu/

Answer 2

Without more specific detail it's hard to answer accurately, but if you want you can just override the :focus style:

// in the CSS file
input:focus {background-color: red;} 

// in your page
input:focus {background-color: inherit;} // overrides with the parent background

Demo