When I click on my button add new row it creates a new row and with the same content as what is in orignal row.

But for each img I would like to be able to have its own unique id / selector rather than the same id.

How am I able to make that possible with code I have.

<script type="text/javascript">
$("#insert-more").click(function () {
     $("#images").each(function () {
        var tds = '<tr>';

        jQuery.each($('tr:last td', this), function () {
            tds += '<td>' + $(this).html() + '</td>';
        });

        tds += '</tr>';

        if ($('tbody', this).length > 0) {

            $('tbody', this).append(tds);

        } else {

            $(this).append(tds);
        }
    });
});

$(document).ready(function() {
    $('body').popover({
        selector: '#example', //Click on image to active popover Need get to have own unique id.
        placement: 'right',
        html: 'true',
        content : '<span class="btn btn-primary btn-file"><i class="fa fa-pencil"></i> <input onchange="readURL(this)"  id="file-input" type="file" name="userfile[]"/></span>'
    });
}); 
</script>

You need to update your line 7. Currently, you copy over the HTML content from the clicked one to the new one...

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.