title: jQuery: get the file name selected from <input type="file" />
body: <p>This code should work <strong>in IE</strong> (don't even test it in Firefox), but it doesn't.
  What I want is to display the name of the attached file. Any help?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
    &lt;title&gt;example&lt;/title&gt;    
    &lt;script type="text/javascript" src="../js/jquery.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;  
          $(document).ready( function(){            
        $("#attach").after("&lt;input id='fakeAttach' type='button' value='attach a file' /&gt;");      
        $("#fakeAttach").click(function() {            
          $("#attach").click();        
          $("#maxSize").after("&lt;div id='temporary'&gt;&lt;span id='attachedFile'&gt;&lt;/span&gt;&lt;input id='remove' type='button' value='remove' /&gt;&lt;/div&gt;");        
          $('#attach').change(function(){
            $("#fakeAttach").attr("disabled","disabled");          
            $("#attachedFile").html($(this).val());
          });        
          $("#remove").click(function(e){
            e.preventDefault();
            $("#attach").replaceWith($("#attach").clone());
            $("#fakeAttach").attr("disabled","");
            $("#temporary").remove();
          });
        })
      }); 
    &lt;/script&gt; 
  &lt;/head&gt;
  &lt;body&gt;
    &lt;input id="attach" type="file" /&gt;&lt;span id="maxSize"&gt;(less than 1MB)&lt;/span&gt;    
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>