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:

Answer

Yes, very easily, using the callback signature of addClass:

$('.rubrique option').addClass(function() {
    return this.value;
});
Answer
$('.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'));
});
Answer

If it's the purpose to style a particular option element, you could consider this approach as well:

.rubrique option[value="2"]{
     background: yellow;
}
Answer

Easiest way to add class to an option..

$("#IdOfSelect option[value='" + valueOfSelect + "']").addClass('hidden');

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.