Focus An Element Created On The Fly

how to focus an element created on the fly?

Solution 1:

Just call .focus() on the element after it's added to the DOM, for example:

var input = document.createElement("input"); //create it
document.body.appendChild(input);            //append it
input.focus();                               //focus it

You can test it out here.

Solution 2:

The focus method will do this. If you have a reference to the newly-created element called elem, then simply invoke:

elem.focus();

Note that you'll need to do this after inserting the element into the document at the appropriate point, of course.

Solution 3:

Try this code,

var txtObj = document.createElement("input");
window.document.body.appendChild(a);
txtObj.focus();

Solution 4:

<script>    
  $('#container').append('<input type="text">');
  $('#container').find('input:last').focus();
</script>

Solution 5:

You can use setTImeOut

setTimeout(function() {
        $("#id_of_element_created").focus().select();
       }, 100);