I use span elements like button and I disable and enable it depending on bussnies condition using old JS code like this:
document.getElementById('lblChecks').disabled = false/true
in HTML
<span id="lblChecks" disabled="disabled" class="GridHeader" onclick="ChecksPoPuP();" style="display:inline-block;color:White;height:19px;width:132px;cursor: hand;">Cheques</span>
In CSS I use .GridHeader[disabled="disabled"] but it doesn't work on chrome, but it works fine on IE.
So how can I filter (.disabled) as dynamic property in CSS
Note: the problem can be solved easily using addClass and removeClass in JQuery but I have a lot of files and its hard to replace all of them
You can define a common class name for all the elements which is disabled/enabled back and forth, and use CSS to style it.
For example:
.att-disabled:disabled{ // style goes here }
Refer more: https://developer.mozilla.org/en-US/docs/Web/CSS/:disabled