add class to option in select
Based on the value of an option would that be possible to add a class to an option?
So if i have this:
<select class="rubrique" name="ctl00">
<option value="" selected="selected"></option>
<option value="1">1</option>
<option value="1">1</option>
</select>
i'll get that:
<select class="rubrique" name="ctl00">
<option class="" value="" selected="selected"></option>
<option class="1" value="1">1</option>
<option class="2" value="1">1</option>
</select>
Answers:
Yes, very easily, using the callback signature of addClass:
$('.rubrique option').addClass(function() {
return this.value;
});
$('.rubrique > option').each(function(){
$(this).addClass($(this).val());
});
Edit: I am not sure if .val() is 100% correct here, you could also use this:
$('.rubrique > option').each(function(){
$(this).addClass($(this).attr('value'));
});
If it's the purpose to style a particular option element, you could consider this approach as well:
.rubrique option[value="2"]{
background: yellow;
}
Easiest way to add class to an option..
$("#IdOfSelect option[value='" + valueOfSelect + "']").addClass('hidden');