JQuery селектор не работает при динамическом добавлении HTML

Question

Я могу динамически добавлять элемент управления «select» в DOM, после добавления его в DOM я хочу изменить html-содержимое последнего элемента «select» (последний «select» добавлен динамически), но это не удалось ...

(Я не могу установить значение параметров в param_html, потому что я должен установить их, используя запрос ajax позже.)

<script>
    $(function(){
      var param_html = '<select class="params"></select>';
      $("input[value='+']").click(function(){
        $('#parameters').append(param_html);
          $('.params :last').html('<option>aaa</option><option>keyword in profile</option><option>last tweet</option>');
      });

    });
  </script>
  <div id="parameters">
    <input type="button" value="+">
    <select class="params"><option>1</option><option>2</option></select>
  </div>

любые предложения приветствуются.

Answer 1

убрать пробел между параметрами и: last

$('.params:last').html('<option>aaa</option><option>keyword in profile</option><option>last tweet</option>');

Answer 2

Ваш контент, кажется, добавляется после загрузки dom.

попробуйте вживую http://api.jquery.com/live/

Answer 3

Что ж, ваш CSS-селектор имеет значение $('.params:last-child') или $('.params:last'), я думаю, пробел там не разрешен.

Также никто не запрещает вам использовать созданный вами объект:

$(function(){
      var param_html = '<select class="params"></select>';
      $("input[value='+']").click(function(){
        $('#parameters').append(param_html);
          $(param_html).html('<option>aaa</option><option>keyword in profile</option><option>last tweet</option>');
      });

    });

Если вы собираетесь использовать AJAX в будущем, то та же идея будет работать вместо повторного выбора использования объекта.на тот, который вы создали.