Javascript code for remove image

Question

I want to make this Javascript code to when I click "remove image" link , it remove the image. Please help me.

<script>
function previewFile(){

   var preview = document.querySelector('img'); 
   var file    = document.querySelector('input[type=file]').files[0];
   var reader  = new FileReader();

   reader.onloadend = function () {
       preview.src = reader.result;
   }
   if (file) {
       reader.readAsDataURL(file); 
   } else {
       preview.src = "";
   }
}

  previewFile();  

</script>

<input type="file" onchange="previewFile()"><br>
<img src="" height="200" alt="Image preview...">
<a href="#">remove image </a>

  </body>
</html>

Answer 1

<img id='image' src="" height="200" alt="Image preview...">
<a id='remove' href="#">remove image </a>

<script>
$(function rmv() {
    $('#remove').click(function() {
            $('#image').remove();
        }

}); 
</script>

Answer 2

If you cannot add id attribute to that img, you can remove it like this with raw javascript - it assumes the image is preceding the anchor tag directly, allowing for only one text node between them:

function removeImage(el){
    if(!el.previousSibling.tagName){//if it is textnode like newline etc. we go one back 
        var el = el.previousSibling;
    }
    if(el.previousSibling.tagName && el.previousSibling.tagName=='IMG'){
        el.previousSibling.remove();
    }
}

<img src="" height="200" alt="Image preview...">
<a href="#" onclick="removeImage(this);">remove image</a>