Question

I’m trying to get all options other than the selected one and with the different class than the selected one.

Consider the following example:

<select name="country" id="country">

    <option value="1" class="option_vat" selected="selected">United Kingdom</option>
    <option value="2" class="option_no_vat">United States</option>
    <option value="3" class="option_vat">Spain</option>
    <option value="4" class="option_vat">Portugal</option>

</select>

Now when change() event is called I want to get the class of the selected option and classes of other options, which are different to the selected one.
In this case the only class that would be added to array would be ‘option_no_vat’ as Spain and Portugal option have the same class at the selected one (United Kingdom).

Could someone suggest a solution please?

Answer 1

Try this:

var classes;

$('#country').change(function()
{
    classes = [];

    $(this).find('option:not(:selected)')
        .not('.' + $(this).find(':selected').attr('class'))
        .each(function()
        {
            var class = $(this).attr('class');

            if ( $.inArray( class, classes ) == -1 )
                classes.push(class);
        });
});

http://jsfiddle.net/9JEyY/

Note: This’ll only work correctly if you have just one class per element.