javascript - getElementsByClassName() is not working -

this question has answer here:

• what queryselectorall, getelementsbyclassname , other getelementsby* methods return? 7 answers

the follwing code sort form list options alphabetically 'getelementsbyclassname()' not working , cant figure out why.

i using latest jquery.

window.onload=function(){     function sortlist() {         var cl = document.getelementsbyclassname('car_options');         var cltexts = new array();          for(i = 1; < cl.length; i++) {             cltexts[i-1] =                 cl.options[i].text.touppercase() + "," +                 cl.options[i].text + "," +                 cl.options[i].value;     }        cltexts.sort();      for(i = 1; < cl.length; i++) {         var parts = cltexts[i-1].split(',');         cl.options[i].text = parts[1];         cl.options[i].value = parts[2];     }     sortlist(); } 

in body section

     <form action="" method="get">          <p><label for="car_make"></label>           <select id="car_make"  class="car_options" name="car_make">               <option value="">by make</option>             <option value="vauxhall">vauxhall</option>             <option value="bmw">bmw</option>             <option value="toyota">toyota</option>             <option value="lexus">lexus</option>             <option value="audi">audi</option>             <option value="ford">ford</option>                  </select>             <label for="car_color"></label>            <select name="car_color" id="car_color" class="car_options">                   <option value="">by color</option>              <option value="red">red</option>             <option value="blue">blue</option>             <option value="black">black</option>             <option value="grey">grey</option>             </select>             <input type="submit" name="search" id="search" value="search">          </form> 

use document.getelementsbyclassname('car_options')[0]

getelementsbyclassname returns set of elements have given class names.

if have multiple elements have iterate through. like

var elements = document.getelementsbyclassname('car_options'); (var = 0; < elements.length; i++) {     elements[i].addeventlistener('click', function() {      }, false); } 

note: in ie supported on ie9+

edit

updated code

function sortlist() {     var elements = document.getelementsbyclassname('car_options');     (var j = 0; j < elements.length; j++) {         var cl = elements[j];         var cltexts = new array();          (i = 1; < cl.options.length; i++) {             cltexts[i - 1] = cl.options[i].text.touppercase() + "," + cl.options[i].text + "," + cl.options[i].value;         }         cltexts.sort();          (i = 1; < cl.options.length; i++) {             var parts = cltexts[i - 1].split(',');             cl.options[i].text = parts[1];             cl.options[i].value = parts[2];         }     } } 

working demo