Currently, the behavior on selection is to highlight the selected item, so modifying the appearance of a selected item would affect the appearance of hovered items as well.
In the meantime, a custom CSS class can be added/removed to the selected item as in the snippet below:
<script>
function OnClientLoad(sender, args) {
var selectedItem = sender.get_selectedItem();
if (selectedItem) {
$telerik.$(selectedItem.get_element()).addClass("rcbSelected");
}
}
function OnClientSelectedIndexChanged(sender, args) {
$telerik.$(sender.get_dropDownElement()).find(".rcbSelected").removeClass("rcbSelected");
var selectedItem = sender.get_selectedItem();
if (selectedItem) {
$telerik.$(selectedItem.get_element()).addClass("rcbSelected");
}
}
</script>
<style>
div.RadComboBoxDropDown .rcbSelected {
color: red;
background-color: lightgreen;
}
</style>
<telerik:RadComboBox ID="RadComboBox1" runat="server" RenderMode="Lightweight" OnClientSelectedIndexChanged="OnClientSelectedIndexChanged" OnClientLoad="OnClientLoad" MaxHeight="150">
<Items>
<telerik:RadComboBoxItem Text="Item 1" />
<telerik:RadComboBoxItem Text="Item 2" />
<telerik:RadComboBoxItem Text="Item 3" Selected="true" />
<telerik:RadComboBoxItem Text="Item 4" />
</Items>
</telerik:RadComboBox>