Получить текст под мышью

Question

У меня есть div, который содержит несколько строк «свободного» текста.

<div id="ItemQueue">&nbsp; 
    <b>ADDED</b><br /> 
    102<br /> 
    103 
</div> 

Когда пользователь нажимает на одну из этих текстовых элементов, таких как 102 или 103, мне нужно, чтобы получить текст под мышкой, где щелкнули в DIV. Моя попытка ниже, однако, это возвращает весь текст в div, а не только текст, находящийся под мышью.

var queue = $('#ItemQueue'); 
queue.click(function (e) { 
    alert($(e.target).text()); 
}); 

Answer 1

$('#ItemQueue').contents().wrap('<span/>') 

$('#ItemQueue > span').click(function() { 
    alert($(this).text()); 
}); 

Answer 2

Лично я бы разделил их на пункты/заголовки

<div id="ItemQueue">&nbsp; 
    <h1 class="Clickable">ADDED</h4> 
    <p class="Clickable">102</p> 
    <p class="Clickable">103</p> 
</div> 

Тогда я бы использовал JQuery

$('.Clickable').click(function(){ 
    alert($(this).html()); 
}); 

Answer 3

я думаю, его лучше использовать класс, как это:

HTML:

<div id="ItemQueue">&nbsp; 
    <b class="span">ADDED</b><br /> 
    <span class="span">102</span><br /> 
    <span class="span">103</span> 
</div> 

Jquery:

$('.span').click(function(){ 
    alert($(this).html()); 
});