Изменение CSS дочернего элемента при наведении курсора на родительский элемент ⇐ Jquery

[Anonymous]

Прежде всего, я предполагаю, что это слишком сложно для CSS3, но если где-то есть решение, я бы с удовольствием использовал его.

HTML довольно прост.



Text Block 1




Text Block 2




Дочерний элемент div имеет значение display:none; по умолчанию, но затем меняется на display:block; когда указатель мыши наведен на родительский элемент div. Проблема в том, что эта разметка появляется в нескольких местах на моем сайте, и я хочу, чтобы дочерний элемент отображался только в том случае, если указатель мыши находится над его родителем, а не в том случае, если указатель мыши находится над любым из других родителей (все они имеют один и тот же класс). имя и никаких идентификаторов).

Я пробовал использовать $(this) и .children(), но безрезультатно.

$('.parent').hover(function(){
$(this).children('.child').css("display","block");
}, function() {
$(this).children('.child').css("display","none");
});


Подробнее здесь: https://stackoverflow.com/questions/506 ... is-hovered