javascript delay function is not working

Question

I am using javascript-based modal dialog. The dialog is fading in and fading out fine, but if I want the fadeout to be delayed by some seconds using delay(3000), it is not working. It simply never fades out. What could I be doing wrong? It's an MVC app.

function testingh(button) {
                alert("DfdfdfF");
                 $('.error-notification').remove();
            var $err = $('<div>').addClass('error-notification')
                                 .html('<h2>Paolo is awesome</h2>(click on this box to close)')
                                 .css('left', $(button).position().left);
            $(button).after($err);
            $err.fadeIn('slow');
            $err.delay(3000).fadeOut('slow');
            }

If you know of a more efficient way to delay(meaning postpone) the fading out, then let me know. using delay(3000).fadeOut seemed most efficient to me?

CSS:

.error-notification {
    background-color:#AE0000;
    color:white;
    cursor:pointer;
    display: none;
    padding:15px;
    padding-top: 0;
    position:absolute;
    z-index:1;
    font-size: 100%;
}

.error-notification h2 {
    font-family:Trebuchet MS,Helvetica,sans-serif;
    font-size:140%;
    font-weight:bold;
    margin-bottom:7px;
}

Answer 1

setTimeout(function() {
    $err.fadeOut()
}, 3000);

Answer 2

Instead of writing

$err.delay(3000).fadeout('slow');

try writing

$err.fadeout('4000');

Answer 3

Isn't that you have to queue-chain your delay? try this

$err.fadeIn('slow').delay(3000).fadeOut('slow');