Class alternative for jquery selectors -

i have code below

<li class="active-always"><a href="#tab-03" data-toggle="tab">alabama</a></li> <li class="active-always"><a href="#tab-04" data-toggle="tab">alaska</a></li> <li class="active-always"><a href="#tab-05" data-toggle="tab">arizona</a></li> <li><a href="#tab-06" data-toggle="tab">california</a></li>  <li><a href="#tab-07" data-toggle="tab">colorado</a></li>    

here selecting <li> elements doesnt have class active-always

$('li:not(.active-always)').addclass('disabled') 

but not sure if doing correct. there must better solution. because using class names becomes confusing. forget purpose of kind of class names.

and ask myself, css or js?

is there simple alternative this?

i know if add own producton tag attributes like

<li flag-active-always><a href="#tab-05" data-toggle="tab">arizona</a> 

my code becomes invalid. there valid solution this? maybe data-active-always can solution.

is there other valid attribute prefix data-...?

is valid use kind of tag attributes without values.data-active-always instead of data-active-always="true"?

is valid use kind of tag attributes without values.data-active-always instead of data-active-always="true"?

data-* attribute should not need have value set , though may not valid xhtml

$("li:not([data-active-always])").addclass("disabled");

.disabled {    color:gray;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <ul>  <li class="active-always"><a href="#tab-03" data-toggle="tab">alabama</a></li>  <li data-active-always><a href="#tab-04" data-toggle="tab">alaska</a></li>  <li data-active-always><a href="#tab-05" data-toggle="tab">arizona</a></li>  <li><a href="#tab-06" data-toggle="tab">california</a></li>   <li><a href="#tab-07" data-toggle="tab">colorado</a></li>    </ul>