How to make something disappear using jQuery?

Question

I have the following drop down:

<select name="chooseLanguage">
    <option>Choose One</option>
    <option value="java">Java</option>
    <option value="php">PHP</option>
    <option value="c++">C++</option>
</select>

If ANYTHING is selected from this dropdown other than the default "Choose One" which is of course preselected, then I want this input field to disappear:

<input type="file" name="uploadFile" />

How can this be achived using jQuery (if possible with a nice fade effect)?

EDIT

My entire code, for some reason none of the answers have worked for me.

<script type="text/javascript" src="jquery/jquery-1.4.2.min.js"></script>

<script type="text/javascript">
$(function(){
  $("#chooseLanguage").change(function(){
    if ($(this).val() == '') {
      $("#uploadFile").hide();
    } else {
      $("#uploadFile").show();
    }
  });
});
</script>

<form action="" method="post">

<select name="chooseLanguage" id="chooseLanguage">
  <option>Choose One</option>
  <option value="java">Java</option>
  <option value="php">PHP</option>
  <option value="c++">C++</option>
</select>

<input type="file" name="uploadFile" id="uploadFile" />

</form>

Answer 1

<input id="uploadFile" type="file" name="uploadFile" />

then you can just use $('#uploadFile').hide()

as suggested you have also fadeOut() and fadeIn() for the opposite effect..

Answer 2

Give the input an id, like id="myupload".

Then, simply:

$('#myupload').fadeOut('slow');

Answer 3

You can do like:

$('select[name="chooseLanguage"]').change(function(){
  if ($(this).val())
  {
     $('input[name="uploadFile"]').fadeOut('slow');
  }
});

Answer 4

Here's another way to do it. Example: find all <div> elements that have a CSS class of "product", and animate them to slowly disappear:

$("div.product").slideUp('slow').addClass("removed");

Answer 5

jQuery

$(document).ready(function(){
  $("#chooselanguage").change(function(){
    if ($("#chooselanguage").attr("selectedIndex")>0) {
      $("#fileupload").fadeOut();
    } else {
      $("#fileupload").fadeIn();
    }
  });
});

HTML

<select id="chooselanguage" name="chooseLanguage">
  <option>Choose One</option>
  <option value="java">Java</option>
  <option value="php">PHP</option>
  <option value="c++">C++</option>
</select>

Answer 6

The other answers are nearly correct, but are missing a minor detail or two. This should hopefully work "out of the box".

$(function(){
  $("#chooseLanguage").change(function(){
    if ($(this).val() == '') {
      $("#uploadFile").hide();
    } else {
      $("#uploadFile").show();
    }
  });
});

Just give the "chooseLanguage" select box an ID of "chooseLanguage", and the upload input an ID of "uploadFile".