Preview an image before it is uploaded

Preview an image before it is uploaded

HTML

<a>Upload image<input type='file' id="image" /></a>
<br>
<img id="set" src="http://wemblo.com/wp-content/uploads/2015/01/wemblo-logo.png" />

CSS

input{opacity:0;position:relative;left:-90px;}
img{max-width:250px;height:auto}
a { border:1px solid red; width:100px; height:100px; display:inline-block; background: red}

JavaScript

function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            
            reader.onload = function (e) {
                $('#set').attr('src', e.target.result);
            }
            
            reader.readAsDataURL(input.files[0]);
        }
    }
    
    $("#image").change(function(){
        readURL(this);
    });