Question

I’m loading a html snippet, insert it after a certain element and want to focus an input field with the class .focus. There could be more than one element with this class. Similar code with load(...) works.

  var item = $(this).closest(".something");
  $.get(
    url, 
    function(data) { 
      item.after(data);
      $(data).find(".focus").focus(); /* everything works except this line */
    }
  );

The relevant part of the loaded html:

<input type="text" class="focus" value="" name="email"/>

It looks like the element to be focussed is found (in the debugger), but it doesn’t get the focus. Any idea what is wrong?

Answer 1

item.after(data) parses data into a set of DOM elements and puts them in your document.

$(data) then parses data into another set of DOM elements, which are never displayed.

You want

$(data).insertAfter(item).find(".focus").focus();