JSFiddle - React, Tailwind, and code Playground

by Al Kasih

HTML

<img id="blah" alt="your image" width="100" height="100" />
<input type="file" 
    onchange="$('#blah')[0].src = window.URL.createObjectURL(this.files[0])">

JavaScript

$(document).ready(function() 
		{
        	$("input[id^='upload_file']").each(function() 
				{
            		var id = parseInt(this.id.replace("upload_file", ""));

            		$("#upload_file" + id).change(function() 
						{
                			if ($("#upload_file" + id).val() !== "") 
								{
                    				$("#moreImageUploadLink").show();
                				}
            			});
        		});
    	});

    $(document).ready(function() 
		{
        	var upload_number = 2;
        	$('#attachMore').click(function() 
				{
					//add more file
					var moreUploadTag = '';
					moreUploadTag += '<div class="element"><label for="upload_file"' + upload_number + '>Upload File ' + upload_number + '</label>';
					moreUploadTag += '<input type="file" id="upload_file' + upload_number + '" name="upload_file' + upload_number + '"/>';
					moreUploadTag += '&nbsp;<a href="javascript:del_file(' + upload_number + ')" style="cursor:pointer;" onclick="return confirm(\"Are you really want to delete ?\")">Delete ' + upload_number + '</a></div>';
					$('<dl id="delete_file' + upload_number + '">' + moreUploadTag + '</dl>').fadeIn('slow').appendTo('#moreImageUpload');
					upload_number++;
        		});
    	});

    function del_file(eleId) 
		{
        	var ele = document.getElementById("delete_file" + eleId);
        	ele.parentNode.removeChild(ele);
    	}

	var ftype = new Array();	

	function readURL (input)
		{
			var files = input.file;
			var output = document.getElementById("result"); 
			var count = 0;
 
			for (var i = 0; i < files.length; i++)
				{
					var file = files[i];
					var picReader = new FileReader();
					var divid = 'div_' + count;
					var spanid = 'span_' + count; 

					picReader.addEventListener("load", function (event)
						{
							var picFile = event.target; 
							var picnames = files[count].name;
							var mimetypes = picFile.result.split(',');
							var mimetype1 = mimetypes[0];
							var mimetype =...