Select Option

by David Speare

HTML

<select id='selectTest'>
    <option value='-'>-</option>
    <option value='<'>Less Than</option>
    <option value='='>Equal To</option>
    <option value='>'>Greater Than</option>
</select>

<span id="test"></span>

CSS

#selectTest{
max-width:35px;
}

#test:before
{
  content:"HelloWorld"
}

JavaScript

var previousOption = null;
$("#selectTest").change(function(){
    var _select = $(this);
    var _option = _select.find("option:selected");
    var _text = _option.text();
    var _val = _option.val();
    _option.val(_text);
    _option.text(_val);
    if(previousOption != null)
    {
        var _prevText = previousOption.text();
        var _prevVal = previousOption.val();
        previousOption.val(_prevText);
        previousOption.text(_prevVal); 
    }
    previousOption = _option;
});