Question

In here,

http://jsfiddle.net/sjKgF/78/

JS CODE

$('.display_box').hover(function (){            
    $(this).attr('class', 'display_box current')
}, function (){
    $(this).attr('class', 'display_box');
});


$('#search').keyup(
function (e){
    var curr = $('#display').find('.current');
    if (e.keyCode == 40) 
    {                                      
        if(curr.length)
        {
                $(curr).attr('class', 'display_box');
                $(curr).next().attr('class', 'display_box current');
        }
        else{
            $('#display div:first-child').attr('class', 'display_box current');
        }                    
    }
    if(e.keyCode==38)
    {                                        
        if(curr.length)
        {                            
                $(curr).attr('class', 'display_box');
                $(curr).prev().attr('class', 'display_box current');
        }
        else{
            $('#display div:last-child').attr('class', 'display_box current');
        }            
    }
}        
)​

ELEMTS

<input type="text" id="search" name="search_fld"/>
<div id="display">
<div class="display_box current">Luca</div>
<div class="display_box">David</div>
<p class="other">Mark</p>
<div class="display_box">...</div>
</div>

​
How can i skip the <p> element and continue with only <div> ?

Thanks

Answer 1

Pass a selector to .next():

$(curr).next('div').attr('class', 'display_box current');

---

it doesnt work like that, i tried this. it doesnt continue to next DIV with text “…” if i do that

Okay, let my try my crystal ball again:

$(curr).nextAll('div').first().attr('class', 'display_box current');