title: hiding an html element after showing for few seconds
body: <p>After a successful ajax call I m showing an element telling the success status. I need to show it temporarily and hide it after say 10 seconds.</p>
  
  <p>I have a paragraph element with the class set to hide on load <code>&lt;p class="response hide" &gt;Successfully Updated!&lt;/p&gt;</code></p>
  
  <p>The code below does not seem to work as the element does not hide after its shown by adding the 'show' class</p>
  
  <pre><code>function UpdateChangeRequest() {
          $.ajax({
              url: '/Request/UpdateRequest',
              cache: false,
              data: $('form[id="RequestForm"]').serialize(),
              type: 'POST',
              success: function (data) {
                  $('.divPartial').html(data);
                  $('.response').addClass('show').removeClass('hide');                    
                  setTimeout(function () {
                      $('.response').fadeOut('fast');
                  }, 1000);
              }
          });
      }
  </code></pre>
  
  <p>Any ideas? thanks</p>