JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>   


<div class="main">

<select id="me">
<option>first</option>
<option>second</option>
<option>third</option>
<option>fourth</option>

</select>

<div id="text"></div>

CSS

.main {
    margin:0 auto;
    width:500px;
    border:solid 1px #F00;
    height:500px
}


#text{ margin-left:50px; margin-top:50px; font:24px/18px Tahoma, Geneva, sans-serif; color:#F00}

JavaScript

function sortUnorderedList(ul, sortDescending) {
          if(typeof ul == "string")
            ul = document.getElementById(ul);

          var lis = ul.getElementsByTagName("option");
          var vals = [];

          for(var i = 0, l = lis.length; i < l; i++)
            vals.push(lis[i].innerHTML);

          vals.sort();

          if(sortDescending)
            vals.reverse();

          for(var i = 0, l = lis.length; i < l; i++)
            lis[i].innerHTML = vals[i];
            }

    sortUnorderedList("me",false);