Getting id of dynamically created element jQuery

I am generating some input fields with a drop-down list. I now want the text entered into those input fields to automatically update a span. But, as the input fields are dynamically generated I'm having a hard time getting it to work with jQuery Thanks for any help! HTML: ``` <div id="url"> https://api.test.com<span id="endpoint" readonly="readonly"> </span> </url> <div class="control-group"> <label class="control-label" for="selectbasic">Endpoint</label> <div class="controls"> <select id="dropdown" name="selectbasic" class="input-xlarge"> <option value = "none">select</option> <option value="id">/test/{id}</option> <option value="id_date">/test/{id}/{date}</option> </select> </div> ``` javascript: ``` $('#dropdown').change(function(){ $('#textBoxContainer').empty(); var data = $(this).find('option:selected').attr('value'); var cleaned_data = data.split("_"); var num_args = cleaned_data.length; for (var i = 0; i < num_args; i++){ $('#textBoxContainer').append('<label class="control-label" for="textinput">' + cleaned_data[i] + '</label><br/><input id="' + cleaned_data[i] + '" name="textinput" size="25" type="text" placeholder="'+ cleaned_data[i] +'" class="input-xlarge"><br/>'); } }); jQuery('#date').on('input', function() { $('#endpoint').html('test'); }) ``` Here's the Fiddle