Получите элементы div в div при наведении указателя мыши

Question

Я хотел бы получить только элементы зависшего DOM, но когда я начал парить, он также запускает родительский дом таким образом;

<div class="testclass"> 
    <div class="divEditmsg">Click to Edit</div> 
    <div class="testclass"> 
     <div class="divEditmsg">Click to Edit</div> 
     <div class="testclass"> 
      <div class="divEditmsg">Click to Edit</div> 
     </div> 
    </div> 
</div> 

Вот мой код:

$(document).on({ 
    mouseenter: function() { 
     $(this).append('<div class="divEditmsg">Click to Edit</div>'); 
    }, 
    mouseleave: function() { 
     $('.divEditmsg').remove(); 
    } 
}, ".testclass"); 

Answer 1

Комментарий является правильным, но неполным.

Почему вы связываете это событие с объектом $(document)? Почему бы не привязать непосредственно к div, который вы хотите применить. Не совсем ясно, что вы пытаетесь сделать здесь, но вы хотите привязать к самому большому элементу ребенка. Затем, если он возится с другими обработчиками событий, используйте event.stopPropagation, чтобы остановить пузырьки событий.

Ваша основная проблема, хотя, я считаю, в этом случае - это то, что вы выбираете для событий мыши.