كيفية استنساخ عنصر وإلحاق ديف معين؟

Question

لديّ صفحة تحتوي على صورة مصغرة للصورة عند النقر فوقها ، يتم استنساخها وإلحاقها بعنصر آخر. المشكلة التي أركض فيها هي أن جميع العناصر التي أحتاج إليها appendTo كلها لها نفس الفئة. لذلك إذا قمت بالنقر فوق صورة مصغرة واحدة ، فسيتم إلحاقها بكل عنصر يحتوي على الفصل view_full_img. إليكم HTML الذي يجب أن أعمل معه. ببساطة استهداف هذه الفصول المختلفة لن تعمل بالنسبة لي ، يتم إنشاء HTML بواسطة Drupal.

<div class="view_full_img"></div>
<div class="thumbs">
    <div class="img blue"></div>
    <div class="img green"></div>
    <div class="img yellow"></div>
</div>

<div class="view_full_img"></div>
<div class="thumbs">
    <div class="img red"></div>
    <div class="img purple"></div>
    <div class="img orange"></div>
</div>

ها هي jQuery ..

$(".thumbs div").click(function(){
    $(".view_full_img div").remove();
    $(this).clone().appendTo(".view_full_img");
});

ما أريد أن يحدث هو أنه عندما أنقر على أحد .thumbs divs أريد أن يتم استنساخه في .view_full_img Div الذي هو مباشرة فوقه. لقد حاولت استخدام مجموعات من closest() prev() parent() الخ ولا يمكن التوصل إلى شيء يعمل.

ها هو JSfiddle ...http://jsfiddle.net/dmcgrew/uetv6/

Answer 1

$(".thumbs div").click(function () {
    var t = $(this);
    t.appendTo(t.parent().prev(".view_full_img"));
});

مثال

Answer 2

انت تحتاج parent(), ، ومن بعد prev():

$(".thumbs div").click(function () {
    $(this).parent().prev(".view_full_img").empty().append($(this).clone());
});