Question

Hey all, I basically need to add a class to every <option> in a select. There is a different class to apply depending on the value of each option.

I need an easy way of doing something like

$('select option').each(function(){

       if($(this).val()=="Argentina"){  $(this).addClass("ar");  }
       if($(this).val()=="Brazil"){  $(this).addClass("br");  }
       if($(this).val()=="Czech"){  $(this).addClass("cz");  }

});

I have a very long list of countries, so using an array of some sort would be preferable, and then let the function filter in the if value = and the class name.

Many thanks

Tim

Answer 1

Sure, use associative array:

var mapping = { "Argentina": "ar", "Brazil": "br", "Czech": "cz"};
$('select option').each(function(){
   var sClass = mapping[$(this).val()];
   if (sClass)
      $(this).addClass(sClass);
});

The if (sClass) is just failsafe to avoid crash when you forget to put country in the array. You can add some default class in such case.