mouseover parent = find () имя дочернего идентификатора

Question

при наведении курсора #divlayer, find() идентификатор ребенка span

HTML:

<div id="divlayer">
        <p>title</p>            

        <span id="apple">apple</span>
        <span id="orange">orange</span>
        <span id="kiwi">kiwi</span>
</div>

JQuery:

$('span').hide();
$('#divlayer').mouseover(function(){
    $('span').show();
    $(this).find(???).attr('id');
});

edit: мой плохой, я должен был уточнить свой вопрос. span дочерние элементы скрыты, когда указатель мыши переходит на <p>title</p>, идентификатор каждого span дочернего элемента возвращается.
По сути, сначала отображается <p>title</p>, а когда мышь наводится на него, отображаются дочерние элементы и идентификаторы возвращаются индивидуально.

Answer 1

Может быть, так .. (отредактировано в соответствии с вашими последними требованиями)

$('#divlayer').mouseover(function(){
    $('span', $(this)).each(function(){
        alert($(this).attr('id'));
    });
});

Answer 2

На основании вашего обновления

$('#divlayer').mouseover(function(){
    $('span').show();
});

$('#divlayer > p').mouseover(function() {
    $('#divlayer').find('span').each(function() {
       alert($(this).attr('id'));
    });
});

Answer 3

HTML:

<div id="divlayer">
    <span class="mouseoverClass" id="apple">apple</span>
    <span class="mouseoverClass" id="orange">orange</span>
    <span class="mouseoverClass" id="kiwi">kiwi</span>
</div>

JQuery:

$(document).ready(function(){
    $('#divlayer').mouseover(function(){
        var accumulator = new Array();
        $(this).find('span').each(function(a,dom){accumulator.push(dom.id);});
        alert(accumulator[0]);
    })
});

вот оно у вас. он берет все идентификаторы и помещает их в аккумулятор. тогда вы можете делать все, что вам нужно с этими идентификаторами