预览图像清除

Question

我正在进行图片上传。我在点击'X'时添加了预览图像取消按钮div被移除然后如果我们上次下载div必须来。 我试过但是在下次没有图像div没有来的时候删除图像div后没有得到。还有另一个简单的方法吗？ 谁能建议我？ 将不胜感激。

$(document).ready(function(){
$('#selectedFile').change(function () {
	    var a = $('#selectedFile').val().toString().split('\\');
	    $('#fileInput').val(a[a.length -1]);
	});
	function readURL(input) {

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

	    reader.onload = function(e) {
	      $('#img').attr('src', e.target.result);
	      $('#img').hide();
	      $('#img').fadeIn(650);

	    }
	    reader.readAsDataURL(input.files[0]);
	  }
	}

	$("#selectedFile").change(function() {
	  readURL(this);
	});
	$('.clear_img_btn').click(function(){
		$('.img_contain').fadeOut(300);
	});

}):

#btn_image {
    padding: 10px;
    border-radius: 0px 8px 8px 0px;
    background: linear-gradient(-80deg, #1B325F, #226296);
    color: #ffffff;
}
#selectedFile {
    position: absolute;
    left: 39%;
    opacity: 0;
}
img#img {
	width: 25%; 
	height: 75px;
}
.of_input {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	flex-basis: 61%;
}
.iva_of_upload { flex-basis:40%; }
.img_contain {position: relative;}
.img_contain a.clear_img_btn {
	position: absolute;
    left: 20%;
    bottom: 1%;
    padding: 1%;
    text-decoration: none;
    border: 1px solid #006799;
    background: linear-gradient(-80deg, #1B325F, #226296);
    color: #ffffff;
	
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  <div class="of_input">
    <div class="iva_of_upload">
      <input type='file' id="selectedFile" />
      <input type="text" id="fileInput" />
      <span onclick="document.getElementById('selectedFile').click();" id="btn_image">Upload</span>
    </div>
      <div class='img_contain'>
        <img id="img" align='middle' alt="" title=''/>
        <a href="#" class="clear_img_btn">x</a>
      </div> 
    </div>