заменить один div с другим при наведении

Я хочу заменить один div другим при наведении на него курсора. В частности, будет в среднем в словах, таких как "изо всех сил» или же "превзойти ожидания "и я хочу заменить это числовым средним, когда пользователь наводит курсор на среднее значение в словах.

#html


  A+ (hover to see score)  


  AVG = 98.35%


#css

.avg_num {
display: none;
}

#jquery

$('.switch').hover(function() {
    $(this).closest('.avg_words').hide();
    $(this).next('div').closest('.avg_num').show();
}, function() {
    $(this).next('div').closest('.avg_num').hide();
    $(this).closest('.avg_words').show();
});

Это'Достаточно просто спрятать первый div и заменить его вторым, но проблема в коде, который восстанавливает нормальное состояние после окончания зависания. Теперь на висениеdivпросто моргайте взад-вперед между собой.

http://jsfiddle.net/uXeg2/1/

Ответы на вопрос(4)

Ваш ответ на вопрос