jQuery - добавить некоторые проблемы с текстом

Question

Мне нужно добавить некоторый текст в другое поле при щелчке изображения. У меня есть изображение, которое появится в «другом div», но текст не будет следовать.

Мой HTML выглядит так:

<div class='smallImg'><img alt='En beskrivelse' class='smallImgImg' src='flot.jpg'></div> 

<div class='smallImgDesc'>   
    <span style='font-size:10px;'> 
     Here should the description be.. 
    </span> 
</div> 


<div id='bigImg'>Image appears here</div> 
<div id='bigImgText'>her skal beskrivelsen komme</div> 

И JS:

$('.smallImgImg').click(function(){ 

    var smallImgText = $(this).next('.smallImgDesc'); 

    $('#bigImg').empty().append($(this).clone()); 
    $('#bigImgText').empty().append($(smallImgText).clone()); 

}); 

Так что, когда я нажал на изображение (.smallImgImg) он показывает его в #bigImg DIV, который работает. Затем я хотел бы добавить описание ниже #bigImg. Но кажется, что я не могу уловить .smallImgDesc, потому что #bigImgText просто пуст.

Я пытался сделать это слишком:

var smallImgText = $(this).find('.smallImgDesc'); 

... и теперь он не будет работать, я не имею ни малейшего представления о том, что теперь делать. Я надеялся, что кто-то может помочь мне здесь :)

Answer 1

Селектор неправильно. Вы должны выбрать элемент после родителя:

var smallImgText = $(this).parent().next('.smallImgDesc'); 

Я также удалил $ обертки вокруг smallImgText, потому что это совершенно не нужно, чтобы обернуть объект JQuery в другом объекте JQuery. Чтобы избежать такой путаницы, вы можете префикс всех переменных объекта jQuery с помощью $, что является соглашением.

Демонстрация: http://jsfiddle.net/kgH3K/

Answer 2

этот кусок кода кажется неправильным вы повторно оборачивать объект Jquery

$('#bigImgText').empty().append(smallImgText.clone());