title: jQuery setupSearchButton animate broken after 2 times clicking on it
body: <p>I have a search button on my website, i have a function that wil animate my input field when clicking by moving it to the right. And if i click out of it then it wil close. </p>
  
  <p>This works only after like 2 times open/close it is broken and won't animate anymorge. I added a <code>console.log();</code>  so i can see what its doing. </p>
  
  <p><img src="https://i.stack.imgur.com/48RQr.png" alt="Screenshot from my console."></p>
  
  <p>Here is my function.</p>
  
  <pre><code>function setupSearchButton()
  {
      j(".icon").click(function() {
          var icon = j(this),
          input = icon.parent().find("#search"),
          submit = icon.parent().find(".submit"),
          is_submit_clicked = false;
          j(".searchform").animate({ "margin-left": "+=180px", "display": "block !important" }, "slow", function(){
              console.log("Move the searchbar to the right 180px;");
          });
  
          // Animate the input field
          input.animate({
              "width": "165px",
              "opacity": 1
          }, 300, function() {
              input.focus();
          });
  
          submit.mousedown(function() {
              is_submit_clicked = true;
          });
  
          // Now, we need to hide the icon too
          icon.fadeOut(300);
  
          input.blur(function() {
              if(!input.val() &amp;&amp; !is_submit_clicked) {
                  input.animate({
                      "width": "0",
                      "padding": "0",
                      "opacity": 0
                  }, 200);
                  // Get the icon back
                  icon.fadeIn(200);
                  j(".searchform").animate({ "margin-left": "-=180px", "display": "block !important" }, "slow", function(){
                      console.log("Move the searchbar back by adding a negative -180px to the left.");
                  });
              };
          });
      });
  }
  </code></pre>
  
  <p>Also i'm using "noconflict".</p>
  
  <p>So what i'm doing wrong here ?.</p>
  
  <p>Thx </p>