on bind an input field that was generated using a ajax call

Question

I am wanting to bind a input field that is generated into the page using ajax.

I have tried a number of different jQuery codes and none of them give any type of success.

Here are the codes I have used:

$('#bookingcoupon').bind('input', function(){});
$(document).on('bind', '#bookingcoupon', function(){});
$('body').on('bind', '#bookingcoupon', function(){});
$('.divname').on('bind', '#bookingcoupon', function(){});

None of which works

When I use a click listener using:

 $('.divwrapper').on('click', '.clickbutton', function(){});

This works fine, it just does not like the bind version of the on() function.

Any advise would be appriciated :)

Answer 1

I made this example, maybe it can help you:

http://jsfiddle.net/xpvt214o/873462/

// find elements
var button = $("button")

// handle click and add class
button.on("click", function(){
  $("#append").append( "<input class='sameClass' type='text'></input></br>" );

  $('.sameClass').change(function(){
    $('.sameClass').bind('change',functionChange(this));
  });

});

function functionChange(obj){
    alert($(obj).val());
};

And the HTML:

<div id="banner-message">
  <button >Add TextBox</button>
  <div id="append">
  </div>
</div>