Question

So I have a structure something like this

<div class="content-block">
    <div class='hidden'> Hidden Content </div>
    <div class='click'> Click Me </div>

    <div class='hidden'> Hidden Content </div>        
    <div class='click'> Click Me </div>

</div>

I want Jquery to animate the hidden content directly so that it expands the height and width. My jquery is

$(".click").click(function(){ 
    $(".click").prev(".hidden").animate({
        width:100%, 
        height: 500px
    }, 500);
});

The problem I am having is that this animates all the .hidden divs not just the one directly previous to .click

Answer 1

Specify the context, with $(this):

$(".click").click(function(){
    $(this).prev(".hidden").animate({width:100%, height: 500px}, 500);
});

In your original code you were selecting all .click elements and, therefore, all their preceding .hidden siblings.