slideDown is not working : <p>why this is not working:</p>

<pre><code>window.setTimeout(function() {
if($(".alert").is(":hidden")) {
  $(".alert").slideDown(500, function() {
    window.setTimeout(function() {
      $(".alert").fadeTo(500, 0).slideUp(500, function() {
          $(this).remove(); 
      });
    }, 4000);
  });
}  
}, 1000);
</code></pre>

<p>HTML:</p>

<pre><code>&lt;div id="login-error" class="container alert alert-danger" role="alert" hidden&gt;
        &lt;button type="button" class="close" data-dismiss="alert" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
        &lt;strong&gt;Error!&lt;/strong&gt; Invalid login or password!
      &lt;/div&gt;
</code></pre>

<p>It is not sliding down, and the element is deleted after 4 seconds.</p>

<p>How to fix, help, please. Thank You!</p>
