I can dynamically append "select" control to DOM,after appending it to DOM,I wanna change the html content of the last "select"(the latest "select" added dynamically),but it failed...

(I cannot set options value in param_html,becuase I should set them by using ajax request later.)

<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>

any suggestion is appreciated.

I can dynamically append "select" control to DOM,after appending it to DOM,I wanna change the html content of the last "select"(the latest "select" added dynamically),but it failed...

(I cannot set options value in param_html,becuase I should set them by using ajax request later.)

<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>

any suggestion is appreciated.

• javascript
• jquery
• html
• dom

• This is very confusing question, and the script you've provided doesn't seem to make sense in context. Can you try and clarify? – Jivings Commented Jun 17, 2011 at 14:48
• 1 actually, it's a problem in his selector ;) – Patricia Commented Jun 17, 2011 at 14:49
• sorry,my english is poor,I have tried my best to express what I want to say correctly – Mark Ma Commented Jun 17, 2011 at 15:17

3 Answers 3

take out the space between params and :last

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

your content seems to be added after the dom has been loaded.

try live http://api.jquery./live/

Well your CSS selector is imporper should be $('.params:last-child') or $('.params:last') i think the space bar is not allowed there.

Also no one forbis You from using the object you've created:

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

    });

If you are going to use AJAX in future then the same idea will work instead of reselecting the object use to one you've created.