ADDING LIST OF ITEMS / NEW ROWS TO TABLE USING JQUERY

IN html DEFINING A TABLE
<div class="row">
                                <hr />
                                <div class="col-md-3">

                                </div>
                                <div class="col-md-5">
                                    <table id="tblFiles" class="tbl table table-bordered">
                                        <thead>
                                            <tr>
                                                <td>
                                                    FileName
                                                </td>

                                                <td>
                                                    Make This as Cover pic?
                                                </td>
                                                <td>
                                                    Remove This Image
                                                </td>
                                            </tr>

                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>


#DONT BOTHER ABOUT CLASS = ROW, COL-MD -5 ...ETC 
WE JUST USED THE BOOTSTRAP CLASSES





DONE??
NOW IN JS...



JAVASCRIPT:
 var files = data.Item.Myfiles;

                for (var i = 0; i < files.length; i += 1) {
                    var path = files[i]._RoomTypeImagePath;
                    var Imgid = files[i]._RoomTypeImageID;
                    var CoverPic = files[i]._RoomTypeDefaultImage;

                    //IF THERE IS ALREADY A COVER PIC MAKE THAT AS CHECKED
                    if (CoverPic == true) {
                        var newItem = "<tr><td><a class='my_images' rel='" + rootURL + path + "'  href='javascript:void(0);'><img src='" + rootURL + path + "' height='100px' width='100px'></a></td><td><input id='chkActive' rel='" + Imgid + "' name='chkActive' type='checkbox' class='MycoverPic' name='fooby[1][]' checked></td> <td><a id='myDelete' rel='" + Imgid + "'  onclick='DeleteImage(this)' class='hidden-print glyphicon glyphicon-remove-circle red'  data-toggle=tooltip' title='' style='text-decoration: none; cursor: pointer; padding-left:10px' data-original-title='Delete Content'></a></td></tr>";
                    }
                    else {
                        var newItem = "<tr><td><a class='my_images' rel='" + rootURL + path + "'  href='javascript:void(0);'><img src='" + rootURL + path + "' height='100px' width='100px'></a></td><td><input id='chkActive' rel='" + Imgid + "' name='chkActive' type='checkbox' class='MycoverPic' name='fooby[1][]'></td> <td><a id='myDelete' rel='" + Imgid + "'  onclick='DeleteImage(this)' class='hidden-print glyphicon glyphicon-remove-circle red'  data-toggle=tooltip' title='' style='text-decoration: none; cursor: pointer; padding-left:10px' data-original-title='Delete Content'></a></td></tr>";
                    }

                 
                    $("#tblFiles tbody").append(newItem);
                }


"rootURL"  IS  NEED TO BE ADDED BEFORE PATH AS SHOWN ABOVE