Question

How can I write a script that will change an input field’s text value, but the field is not yet created?

The script is loaded before the input field is created. It needs to know that when any input with a certain class is created, it will then have some text put in to its value. Can this be done with live()?

To clarify, the order of events are:

1 – Application-wide JavaScript for the page is loaded. This contains script something along the lines of:

$('.myDiv input').each(function() {
    $(this).val('some text');
});

2 – A second page-specific script is now loaded, which dynamically creates an input on the page, with no value. I CANNOT MODIFY THIS SCRIPT. This is important, I need a solution that does not modify this script (otherwise I wouldn’t be posting here).

$('.myDiv').html('<input type="text" />');

Answer 1

Yes, live() will do what you want. It will work as long as you use jQuery to add the elements dynamically.

The jQuery.live() api is clear on this

Use live() to bind on focus or blur or keyup whenever you want to change the value of the input field.

$('.clickme').live('click', function() {
  // Live handler called.
});

UPDATE: assuming you cant change the input elements in any way before the are added.

$('#container').bind("DOMSubtreeModified",function() { 
   $('input.myClass:not(.alreadyChanged)').val("whatever you want to change it to");
   $('input.myClass:not(.alreadyChanged)').addClass('.alreadyChanged');
}

This way you don’t need to use live() when a new element is added to the DOM, the function is automatically triggered.