Управление динамическими элементами в jQuery

Question

У меня есть выпадающее меню со значениями, которые генерируются динамически с помощью шаблонов Jade. Когда один из пунктов меню выпадающего нажата, я хочу, чтобы текст заголовка выпадающего для обновления к текстовому значению пункта меню выбранного, например, так:

-Select an item:- 
    - Item 1 
    - Item 2 
    - Item 3 

[somebody clicks on item 3...]---> 

-Item 3:- 
    - Item 1 
    - Item 2 
    - Item 3 

Вот мой код:

$('.selectShow').click(function() { 
    console.log($(this).text); 
    $('#showSelectDropdown').text($(this).text); 
}); 

консоль получает странный неопределенный объект JSON, и если я изменяю третью строку на что-то вроде $(#showSelectDropdown).text('hello!');, это работает, поэтому я предполагаю, что это проблема с тем, что значения генерируются динамически (хотя мне непонятно, почему это проблема поскольку я использую jquery, и все это завернуто в (document).ready. Я нашел аналогичный stackOverflow thread, который предлагает использовать делегирование событий с помощью селектора .on('click)..., но я все равно получаю те же результаты. Я немного в тупике. Любые предложения оценили!

Answer 1

Заменить .text на .text():

$('.selectShow').click(function() { 
    console.log($(this).text()); 
    $('#showSelectDropdown').text($(this).text()); 
}); 

See the full .text() documentation.