how to reset a dynamically/ajax-ly added/created form using jquery?

In my webpage a form is inserted via Ajax. I am using $("#my-ajax-returned-form")[0].reset(); to reset the form but it doesn't work for me. Firebug console shows TypeError: $("#my-ajax-returned-form")[0] is undefined. Any clue how to fix it? The actual flow is as following and its plain vanilla AJAX with jquery

• Click on a icon sends an ajax call to server
• The server sends a form which is inserted into webpage using $('#target-div').html(returnedFormHTML) which contains my form with id my-ajax-returned-form
• User fills up form and clicks save, data is posted to server using $.post()
• On success I fire another m开发者_如何学运维ethod which is trying to reset my-ajax-returned-form using $("#my-ajax-returned-form")[0].reset();

Now, it is obvious that form has to be some live in some sense but I am unable to figure it out :(

Here is the main webpage - http://pastebin.com/rtkr8RUC Here is the #my-ajax-returned-form form - http://pastebin.com/jtjakgUt I can not post the complete code on jsfiddle easily, bear with me for that

Update I found the issue, there is a reset button in the form named reset, so obviously form.reset is not a function.

But the textarea is still not reset! Fixed the textarea issue as well

The undefined clearly indicates that there's a problem finding the form. Are you sure the selector is correct, are you looking for it inside the correct iframe etc. Try logging the $("#my-ajax-returned-form") to see if it finds anything.

You could try $('#my-ajax-returned-form').eq(0).reset(), but since the selector is an id and so should be unique, this doesn't seem to make much sense.

On the other hand, is the reset() - function even defined?