How to select and display image using FileReader

You have duplicate ids all over (imgInp and blah), so the selector will select only the first one, eventually your event is bound only to the first input field and the selection of $(‘#blah’) as well. You need to select the relative image with respect to the input. You dont have to duplicate the script as well. Select the next image tag relative to the input like $(input).next(‘img’).attr(‘src’, e.target.result);

function readURL(input) {

if (input.files && input.files[0]) {
var reader = new FileReader();

reader.onload = function (e) {
$('#blah').attr('src', e.target.result);
$("#blah").fadeIn(400).html('<img src="img/ajax-loader.gif" />');
}
reader.readAsDataURL(input.files[0]);
}
}

$(document).ready(function(){
$("#photoimg").change(function(){
readURL(this);
})

});

Using html to uploade and display image.

<img  id="blah" alt="" src="images/avatar.jpg">
<input type="file" name="photoimg" id="image" value="" />?