JSFiddle - React, Tailwind, and code Playground

HTML

<select id='sortThis'>
<option value=''>-リセット-</option>
<option value='20160823'>2016年08月23日</option>
<option value='20160822' selected>2016年08月22日</option>
<option value='20160824'>2016年08月24日</option>
<option value='20160820'>2016年08月20日</option>
<option value='20160819'>2016年08月19日</option>
<option value='20160818'>2016年08月18日</option>
</select>

CSS

#sortThis {
    width: 13em;
}

JavaScript

(function($) {
  $(function() {
    var options = $("#sortThis option");  
    var arr = options.map(function(i, o) {
      return {
        text: $(o).text(),
        val: o.value,
        sel: o.selected //true || false
      };
    }).get();

    arr.sort(function(o1, o2) {
      return o1.text > o2.text ? 1 : o1.text < o2.text ? -1 : 0;
    });
    options.each(function(i, o) {
      o.value = arr[i].val;
      $(o).text(arr[i].text);
      //o.selected = arr[i].sel;
      if (arr[i].sel) {
          $(o).attr("selected",true);
      } else {
          $(o).attr("selected",false);
      }
    });

  });
})(jQuery);