jQuery problem on click event triggering hidden content

I'm trying to load inline hidden content by fading it inside another div. The thing is that I can't prevent the content from being 开发者_StackOverflow社区duplicated when there's more than one div with hidden content that have the same classes.

Here is a jsfiddle for better understanding: http://jsfiddle.net/EjU7M

Any help would be appreciated, thanks in advance!

In your example you were querying all elements with a classname you will need to traverse the dom and match the elments near your link.

$('.link').click(function() {
    var $box = $(this).prevAll(".box:first"); //find the nearest .box
    var $remove = $b.find(".remove"); //find the remove in that box.
    var $text = $(this).prevAll(".full_text:first"); //find the text
    $remove.stop().animate({
        opacity: 0
    }, 'fast', function() {
        $remove.remove();
        $text.stop().fadeTo('fast', 1).appendTo($box);
    });
    return false;
})

Code example on jsfiddle.