jQuery search options for value and mark checked

Question

I have a database that I am pulling some states from, here is what the JSON I get back from it is:

["Arkansas","California","Connecticut","Florida"]

I have a list of all of the states in an option group, like follows:

<select name="geoStates" id="geoStates" class="select2" multiple>
<option></option>
<optgroup label="United States">
    <option value="Alabama" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/5/5c/Flag_of_Alabama.svg/23px-Flag_of_Alabama.svg.png">Alabama</option>
    <option value="Alaska" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Flag_of_Alaska.svg/21px-Flag_of_Alaska.svg.png">Alaska</option>
    <option value="Arizona" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Flag_of_Arizona.svg/23px-Flag_of_Arizona.svg.png">Arizona</option>
    <option value="Arkansas" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9d/Flag_of_Arkansas.svg/23px-Flag_of_Arkansas.svg.png">Arkansas</option>
    <option value="California" data-iconurl="http://upload.wikimedia.org/wikipedia/commons/thumb/0/01/Flag_of_California.svg/23px-Flag_of_California.svg.png">California</option>

And so on for all of the states, is there a way for me to go through all of the values, and check the ones that I get back from the database based on the value of the option? This is something I have never had to do, so it is really tricky for me. :P

If I need to add anything, please ask.

Answer 1

Here's one way:

selected = ["Arkansas","California","Connecticut","Florida"];

$("#geoStates option").each(function(elem) {
    if ($.inArray($(this).val(), selected) != -1) {
        $(this).prop('selected', true);    
    }
});

Here's a jsfiddle showing it

http://jsfiddle.net/sQD8q/