Change image src with jQuery autocomplete

I have this jQuery autocomplete function that works terrifically. But, I wanna make it so that when the user clicks on one of the choices from the drop down box and the value is then transferred to the input field that the image src attribute will change to the value of 开发者_StackOverflow中文版what's in the input field. My jQuery code is as follows.

$(document).ready(function() {
  $('#team').change(function getPic() {
    var logo = $('input#team').val();
    $('img#team_wallpaper').attr("src", "mlb/" +logo+ ".png");
  });

  var data = ["Baltimore Orioles", "New York Yankees", ..., "San Diego Padres"];
  $("#team").autocomplete({ source: data });
})

My html code is this:

<h1 id="invite_line">
  Favorite team <br /><input type="text" id="team" class="bar" name="team" />
</h1>

<img src="mlb/mlb.png"  width="140" height="210" id="team_wallpaper"/>

For some reason, it seems as if jQuery isn't getting the correct value of what's in the input field. It's only giving a single letter for the value of the team variable.

Any thoughts?

I don't know if this will really work but:

 $('#team').autocomplete(data)
      .result(function(event, item) {
          $('img#team_wallpaper').attr("src", "mlb/" +item.text+ ".png");
      });

See: http://docs.jquery.com/Plugins/Autocomplete#API_Documentation at the very bottom "Search Page Replacement"

You are catching the onchange of the text field before the autocomplete can update it. you can try attaching to the select event on the autocompleat

$("#team").autocomplete({ 
   source: data, 
   select: function(event,ui){alert(ui.item.value)}})