Javascript 更改“单击时选择框css”选项

我正试图根据所选的

选项向
select
元素添加一个类

HTML

<select class="wordpress">
  <option value="1" class="wordpress">Hello</option>
  <option value="2" class="joomla">2222</option>
  <option value="3" class="wordpress">33333</option>
  <option value="4" class="joomla">44444</option>
</select>

JS

select{
  margin-top:50px;
  padding:10px;
  font-size:30px;
  border:1px solid #ccc;
}
.wordpress{
  background:url('http://muabanraovat.com/images/imgWordpress32.png') no-repeat center left transparent;
  padding-left:35px;
}
.joomla{
  background:url('https://a6a8g7g5.ssl.hwcdn.net/icons/22/216447/icon.png') no-repeat center left transparent;
  padding-left:35px;
}

$(document).ready(function($){
    $('select').change(function(){
        $(this).removeClass().addClass('wordpress');
    });
});

CSS组：
因此使用所选选项的文本

改变

$(this).removeClass().addClass('wordpress');

到


$（文档）.ready（函数（$）{
$（'select'）.change（函数（）{
$（this.removeClass（）.addClass（$（this.children）（$（option[value=“”+$（this.val（）+“]））.attr（'class'）；
});
});
选择{
边缘顶部：50px；
填充：10px；
字体大小：30px；
边框：1px实心#ccc；
}
wordpress先生{
背景：url（'http://muabanraovat.com/images/imgWordpress32.png'）没有重复左中透明；
左侧填充：35px；
}
乔姆拉先生{
背景：url（'https://a6a8g7g5.ssl.hwcdn.net/icons/22/216447/icon.png'）没有重复左中透明；
左侧填充：35px；
}

你好
2222
33333
44444

虽然您已经选择了一个答案，但考虑到目前为止所有答案似乎都有点过于复杂，我想我会提供一个进一步的选择。尽管如此，我还是建议：

$('select').change(function () {
  // setting the className of the changed <select> element 
  // to the className of the selected <option>
  // (this.selectedIndex gives theindex of the selected
  // <option> from among the options collection of the
  // <select> element:
    this.className = this.value;
});

选择{
边框：2倍实心#000；
}
wordpress先生{
边框颜色：红色；
}
乔姆拉先生{
边框颜色：绿色；
}

你好
2222
33333
44444
不要求投反对票就是要求投反对票谢谢。正是我要找的。谢谢你的帮助。您的代码也可以工作。但是@daniel sunami的代码对我来说更简单。
$(this).removeClass().addClass(this.options[this.selectedIndex].className);

$('select').change(function () {
  // setting the className of the changed <select> element 
  // to the className of the selected <option>
  // (this.selectedIndex gives theindex of the selected
  // <option> from among the options collection of the
  // <select> element:
    this.className = this.value;
});