<select> window not updating after change in selected attribute in <option>
firefox, html, jquery
Solution
Sine this is changing the attribute after the initial value, it is technically a property, and you should use `$(this).prop()` instead of `$(this).attr()`.
Also, try setting the value to `true` instead of `selected`
`$(this).prop('selected',true);`
Alternatively, you could also set the value of the `select` element:
`$('.type_c').val(pageType);`
Problem
The sign up form I'm creating has Business and Residential option in select dropdown. Based on the active page type, I change the default selected option. Here's the html: ``` <select class="type_c" name="type_c"> // default selected is business <option value="Business" selected="selected">Business</option> <option value="Residential">Residential</option> </select> ``` Here's the code I run in the footer of every page to change those values: ``` $(function(){ var pageType = getPageType(); // returns either 'Business' or 'Residential' $('.type_c option').each(function(){ $(this).removeAttr('selected'); }); $('.type_c option').each(function(){ if($(this).html() == pageType) $(this).attr('selected','selected') }); }); ``` The issue is that when it's on a 'Residential' page, the 'Residential' option is selected in DOM but visually, the 'Business' option is selected! Thanks.