Q:

Select to javascript Array

I want to save all my options as a javaScript Array
Html
 <select id="mySelect">
  <option value="0"> option 2 </option>
  <option value="0"> option 3 </option>
  <option value="0"> option 4 </option>
  <option value="0"> option 5 </option>
 </select>

Js 
 $select = $("#mySelect");
 $options = $select.find("option");

 for(var i = 0; i < $options.length; i++ ) {
  alert($options[i].val()); 
}

alert($options[i].val()); won't work , I got $options[i].val() is not a function 

A:

If you're using jQuery:
var arr = $('#mySelect option').map(function(){
              return this.value;
          }).get();

JS Fiddle demo.
The reason that options[i].val() failed is that options[i] is a native DOM node, not a jQuery object.
If you'd like to do the same with plain JavaScript:
var opts = document.getElementById('mySelect').getElementsByTagName('option'),
    arr = [];
for (var i = 0, len = opts.length; i < len; i++) {
    arr.push(opts[i].value);
}

JS Fiddle demo.
Or, for more up-to-date browsers:
var opts = document.querySelectorAll('#mySelect option'),
    arr = [];
for (var i = 0, len = opts.length; i < len; i++) {
    arr.push(opts[i].value);
}

JS Fiddle demo.
And in slightly more modern browsers:
var arr = [].map.call(document.querySelectorAll('#mySelect option'), function(a){
    return a.value;
});

console.log(arr);

JS Fiddle demo.
Also, if you'd like to take both the value and the text-content from the options (as a simple demo, using the second code-sample from above as the basis):
var opts = document.getElementById('mySelect').getElementsByTagName('option'),
    arr = [], tmp;
for (var i = 0, len = opts.length; i < len; i++) {
    tmp = opts[i];
    arr.push({'value' : tmp.value, 'content' : (tmp.textContent || tmp.innerText)})
}

console.log(arr);

JS Fiddle demo.
References:

'Plain' JavaScript:

Array.prototype.map().
Array.push().
document.getElementById().
document.querySelectorAll().
Function.prototype.call().

jQuery:

map() (jQuery).
get().

A:

Thats because when you do $options[i] you don't get a jquery object, you get an element. use value:
 $select = $("#mySelect");
 $options = $select.find("option");

 for(var i = 0; i < $options.length; i++ ) {
  alert($options[i].value); 
}

If you want a jquery object, you can use .eq() instead... like this:
 $select = $("#mySelect");
 $options = $select.find("option");

 for(var i = 0; i < $options.length; i++ ) {
  alert($options.eq(i).val()); 
}

Either way will work fine, although the second will create a jquery object which is not necessary in this case.
http://jsfiddle.net/pnkpF/
http://jsfiddle.net/pnkpF/1/

A:

val is not the correct attribute for the option tag. Use value instead:
<select id="mySelect">
  <option value="0"> option 2 </option>
  <option value="0"> option 3 </option>
  <option value="0"> option 4 </option>
  <option value="0"> option 5 </option>
</select>

Also, if you select [i] from a jQuery array, you get the raw HTML element. Wrap it in jQuery again to have access to functions like .val():
$select = $("#mySelect");
$options = $select.find("option");

for(var i = 0; i < $options.length; i++ ) {
  alert($($options[i]).val()); 
}

