Dynamically added input field disappearing rightaway
<p>I am trying to write a jQuery snippet, in which I can add input fields dynamically on click of 'Add Image' button (code below) using jQuery appendTo() function. However, everytime I click on the button the textbox appears and then disappears rightaway. I have noticed that others have also faced this problem, but am not able to find a proper solution for this problem. Can someone please help me out with this?</p>

<pre><code>...
&lt;div class="row"&gt;
    &lt;div class="span4" id="images-div"&gt;
        &lt;input type="text" name="txt-image[]" class="span4 txt-input-field"&gt;
    &lt;/div&gt;
    &lt;div class="span1"&gt;
        &lt;button class="btn" id="btn-add-image"&gt;Add Image&lt;/button&gt;
    &lt;/div&gt;
&lt;/div&gt;

&lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"&gt;&lt;/script&gt;
&lt;script&gt;
    $(document).ready(function(){
        $('#btn-add-image').click(function() {
            $('&lt;input type="text" name="txt-image[]" class="span4 txt-input-field"&gt;').appendTo('#images-div');
        });
    });
&lt;/script&gt;
...
</code></pre>
