Как клонировать элемент и добавить к конкретному div?

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());
});