Iterate through select options

Question

I have a  lt select gt  element in HTML  This element represents a drop down list  I m trying to understand how to iterate through the options in the  lt select gt  element via JQuery   How do I use JQuery to display the value and text of each option in a  lt select gt  element  I just want to display them in an alert   box

User · Answer

If you don t want Jquery  and can use ES6   for  const option of document getElementById  mySelect        console log option

User · Answer

Another variation on the already proposed answers without jQuery    Object values document getElementById  mySelect   options  forEach option   gt  alert option

User · Answer

can also Use parameterized each with index and the element       selectIntegrationConf   find  option   each function index element    console log index    console log element value    console log element text             this will also work      selectIntegrationConf option   each function index element    console log index    console log element value    console log element text

User · Answer

And the requisite  non-jquery way  for followers  since google seems to send everyone here     var select   document getElementById  select id      for  var i   0  i  lt  select length  i         var option   select options i          now have option text  option value

User · Answer

This worked for me    function             select option   each function i           alert   this  text               this  val

User · Answer

You can try like this too   Your HTML Code   lt select id  mySelectionBox  gt       lt option value  hello  gt Foo lt  option gt       lt option value  hello1  gt Foo1 lt  option gt       lt option value  hello2  gt Foo2 lt  option gt       lt option value  hello3  gt Foo3 lt  option gt   lt  select gt    You JQuery Code      mySelectionBox option   each function         alert this text         this value         OR  var select        mySelectionBox   0      for  var i   0  i  lt  select length  i         var option   select options i       alert  option text         option value

User · Answer

selectId  gt  option   each function         alert this text         this value          http   api jquery com each  http   jsfiddle net Rx3AP

User · Answer

each     MySelect option    function                        alert   this  text       -       this  val

User · Answer

After try several code  and still not working  I go to official documentation of select2 js  here the link  https   select2 org programmatic-control add-select-clear-items from that the way to clear selection select2 js is      mySelect2   val null  trigger  change

[jquery] Iterate through <select> options

Examples related to jquery