title: jQuery show and hide image
body: <p>I am a new at this so go easy on me! Below I have some code which previews an image once it has been selected. However when no image is selected it comes up with this horrible box that has the default image symbol when no image is selected.</p>
  
  <p>How can I make the image tag hide when nothing is selected and shown when something is?</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;form id="form1" runat="server"&gt;
      &lt;input type='file' id="imgInp" /&gt;
      &lt;img id="blah" src="#"  width="400" alt="your image" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Javascript </p>
  
  <pre><code>function readURL(input) {
      if (input.files &amp;&amp; input.files[0]) {
          var reader = new FileReader();            
          reader.onload = function (e) {
              $('#blah').attr('src', e.target.result);
          }            
          reader.readAsDataURL(input.files[0]);
      }
  }
  
  $("#imgInp").change(function(){
      readURL(this);
  });
  </code></pre>