Estoy tratando de mostrar una descripción al pasar el cursor sobre una opción en una lista de selección, sin embargo, estoy teniendo problemas para que el código se reconozca al pasar el cursor.

Código relevante:

Seleccione trozo de forma:

<select name="optionList" id="optionList" onclick="rankFeatures(false)" size="5"></select>
<select name="ranks" id="ranks" size="5"></select>

Manipulación de selecciones (matrices definidas anteriormente):

function rankFeatures(create) {

    var $optionList = $("#optionList");
    var $ranks = $("#ranks");

if(create == true) {
    for(i=0; i<5; i++){
        $optionList.append(features[i]);
    };
}
else {
    var index = $optionList.val();
    $('#optionList option:selected').remove();
    $ranks.append(features[index]);
};

}

Todo esto funciona. Todo se derrumba cuando trato de manejar las opciones que se ciernen sobre ellas:

$(document).ready( 

function (event) {
$('select').hover(function(e) {
    var $target = $(e.target);
    if($target.is('option')) {
        alert('yeah!');
    };
})
})

Encontré ese código mientras buscaba a través de Stack Exchange, pero no tengo suerte de hacerlo funcionar. La alerta se produce cuando hago clic en una opción. Si no muevo el mouse y cierro la alerta presionando Enter, desaparece. Si cierro con el mouse aparece una segunda ventana de alerta. El simple hecho de mover el mouse alrededor de la selección ocasiona que aparezca un cuadro de alerta. He intentado apuntar directamente a las opciones, pero he tenido poco éxito con eso. ¿Cómo obtengo una alerta emergente si me desplazo sobre una opción?

¡Gracias por leer!