От верха моей головы, попробуйте это:
<select id="state_province">
<option value="state">State</option>
<option value="province">Province</option>
$('#state_province').bind('change', function() {
if($('option:selected', this).val() == 'state') {
$('option[value=state]', this).show().addClass("required");
$('option[value=province]', this).hide().removeClass("required");
} else {
$('option[value=province]', this).show().addClass("required");
$('option[value=state]', this).hide().removeClass("required");
}
});
Редактировать на основе вашего комментария:
Ах, вы хотите что-то вроде: (извините, я делаю это по памяти, поэтому возможны твики)
<select id="state" class="state_province">
...
</select>
<input type="text" id="province" class="state_province" />
===
$('.state_province').bind('change', function() {
var jThis = $(this);
if ( jThis.is('select:selected') ) { // state selected
jThis.addClass("required");
$('input.state_province').removeClass("required");
$(this).parents('.usa').addClass("required");
}
if ( jThis.is('input:filled') ) { // province filled
jThis.addClass("required");
$('select.state_province').removeClass("required");
$(this).parents('.usa').removeClass("required");
}
});