how to load image in dynamic table using ajax success data

Question

Html

<table id="HigPurchtbltabl" class="table table-striped dataTable no-footer">

<thead>
<tr>
<th>Table No</th>

</tr>
</thead>
<tbody></tbody>

</table>

 

 

Sctipt

<script type="text/javascript">
function getTablelist() {
debugger
$.ajax({
url: '../File/GetTableList',
type: 'POST',
dataType:"JSON",
success: function (data) {
debugger;
alert(data[0].FileName);

var HigPursdTrHTML = '';
var sno = 0;
$.each(data, function (i, item) {
HigPursdTrHTML += '<tr><td><img src ="' + data[i] + '.png"></td><tr>';

});
$("#HigPurchtbltabl").append(HigPursdTrHTML);
},
error: function (data) {
debugger;
alert("error")
}
});
}
</script>

 

Controller

[HttpPost]
public ActionResult GetTableList()
{
var fileToRetrieve = db.Files.ToList();
return Json(fileToRetrieve);
}