jquery append only appends in first element of list or shows error [object Object]
<p>I have a variable <code>var $deleteEl = $('&lt;a class="upload_delete" href="#"&gt;Delete&lt;/a&gt;');</code> which is a delete link that need to be created next to each uploaded image.
html structure is next:</p>

<pre><code>&lt;ul id="thumb_galery"&gt;
    &lt;li class="thumb"&gt;
        &lt;img&gt;
        &lt;a class="upload_delete"&gt;&lt;/a&gt;
    &lt;/li&gt;
    &lt;li class="thumb"&gt;
        &lt;img&gt;
        &lt;a class="upload_delete"&gt;&lt;/a&gt;
    &lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>for every uploaded image, thumb with image is appended to thumb_galery</p>

<pre><code>$(thumb_galery).append('&lt;li id="thumb"&gt;&lt;img src="img/success.jpg" alt="' + fileName + '"&gt;&lt;/li&gt;');
</code></pre>

<p>i need to add delete link in the same <code>li</code> next to the image as provided in html structure.</p>

<p>If i append delete link like this</p>

<pre><code>$(thumb).append($deleteEl);
</code></pre>

<p>it works great for first image uploaded, but for next images it only appends it to the first <code>li</code> with class thumb.</p>

<p>How can the delete link be appended in <code>li</code> for the next uploaded image?</p>

<p>The other solution i tried is to place a variable in the first append like this</p>

<pre><code>$(thumb_galery).append('&lt;li class="thumb"&gt;&lt;img src="img/success.jpg" alt="' + fileName + '"&gt;' + $deleteEl + '&lt;/li&gt;');
</code></pre>

<p>This creates the perfect html structure but instead of delete link it shows [object Object]</p>
