title: resize field and resize back outside click
body: <p>I'm new to jquery and I kinda don't get around this. So I have a searchbox (.search) which I want to resize when it's clicked. That does work, the searchfield get's "bigger". But, when I click outside the searchfield I want it to grow back again. I tried doing it with a "body"-click-method. But it doesn't work.</p>
  
  <p>So here's my code:</p>
  
  <pre><code>$(function() {
  $('.search').click(function() {
      $('.search').css('width', '450px');
  });});
  </code></pre>
  
  <p>Another question: How can I combine this change with an animation?</p>