I have a list of `<select>` tags, 22 in total. I use `.find('className');` to store them all in array and then loop through them to get the value of each. 

The question is how do I do it exactly with jquery only? Because if I try to use `.val()` on item that's already been stored in variable, I will get the error `.val() is not a function`. So what happens to an element once it's been stored to var? Right now it looks like this: 

```
var foo = $('.products_container').find('.fn_variant option:selected'); 

```

all selected options. Each looks like - 

```
<option selected="selected" value="13855" data-price="5 600" data-city_id="5" data-stock="65" data-multiplicity="1">
</option>

```

loop code:

```
for(f in foo) {
    if (typeof foo[f] == 'object') {
        console.log(foo[f].dataset.city_id); 
        // this is the way i'm accessing values right now, which is inconvenient and unclear.
        }
    }

```