Question

So i want to isolate the element directly below the link clicked

so for example here is my Jquery and if I click on the link with the class drop all the links on the page that have the class drop_down slidedown. How can i use “this” or anything to isolate only one at a time.

$(document).ready(function(){
    $('.drop').click(function(){
        if($('.drop_down').is(':visible')) {
            $('.drop_down').slideUp();
        } else {
            $('.drop_down').slideDown();
        }
    });
});

<li><a class="drop" href="#">Video Training</a></li>
<li class="drop_down">Click on the links below to get some more information or to buy now <div>&nbsp</div> <a class="button" href="/training_dvds">More Info</a><a class="button" href="/pos_support/aldelo_training_dvd">Buy Now</a></li>                      

Answer 1

.drop doesn’t have any children except for a text node.

If you meant that you want to affect the li.drop_down below the link’s parent, then do this:

$('.drop').click(function(){
    var $next = $(this).parent().next('li.drop_down');
    if($next.is(':visible')) {
        $next.slideUp();
    } else {
        $next.slideDown();
    }
});