jquery animated message

HTML

<button  onclick="addMessage2()"> addMessage</button>
<div id="cont" class="sep" style="background-color:#006EAB; width:520px;height:25px;">
<div id="messagePopup" style="color:white;display:none; padding-left:5px;" >asdfasdf
</div>
</div>

CSS

.roundBorder{
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.sep{
    padding-left:5px;
    padding-top:4px;
    padding-bottom:2px;
    padding-right:5px;
}

JavaScript

function addMessage2(){
     document.getElementById("messagePopup").innerHTML="message: "+new Date();
    if($('#messagePopup').data('timer'))
       cancelSHow();
   $('#messagePopup').queue("fx", []);
    showM();
}

function showM() {

    $('#messagePopup').slideDown(0,function() {
    var elem = $(this);
        $('#cont').animate({opacity:0.2}, 400).animate({opacity:1}, 400);
    $.data(this, 'timer', setTimeout(function() { elem.slideUp(400); }, 4000));
  });
}

function cancelSHow() {
  clearTimeout($('#messagePopup').stop().data('timer'));
}