title: How do i condense this jQuery down so it's more efficient?
body: <p>Below is some jQuery code the i wrote to make a simple animation. However I'm SO new to it i have no idea how to condense it down and get baffled by tutorials!</p>
  
  <pre><code>&lt;!-- Login Form Div Animation --&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function() {
      $('#button-active').hide();
      if ($("#LoginButton").hasClass("inactive")) {
              $("#TopLoginForm").hide();
      } else {
              $("#TopLoginForm").show();
      }
      $("#LoginButton").click( function() {
          if ($("#LoginButton").hasClass("inactive")) {
              $("#LoginButton").animate({ 
                  marginTop: "-40px"
                  }, 500 );
              $("#button-inactive").animate({ 
                  opacity: "0"
                  }, 500 );
              $('#button-inactive').remove();
              $('#button-active').hide();
              $('#button-active').delay(30).fadeIn(1000);
              $('#LoginWelcome').delay(0).fadeOut(1000);
              $('#TopLoginForm').delay(800).fadeIn(1000);
              $("#LoginButton").addClass("button");
              $("#LoginButton.button").click( function() {
                  document.forms["LoginForm"].submit();
              });
           }
      }); 
  });
  &lt;/script&gt;
  &lt;!-- End Login Form Div Animation --&gt;
  </code></pre>
  
  <p>The live code can be seen on www.trainingthemlive.co.uk/temp its at the top of the page</p>