Currently im developing a web application using Ajax to display the notification message. But I don't know why the closing button on the notfication message dialog is not working in any IE browser(tested with 9.0 and 7.0) but its working fine with Firefox And the werid thing is that if I hardcoded jquery code in my html code it work fine with IE browser.
I'm thinking when the message sent across from Ajax is somehow affecting the javascript but I couldn't figure out the reason.
Can anyone please help me out? Thanks so much in advance!
Here is my jquery notification box message code
<div class="notification information png_bg">
<a href="#" class="close">
<img src="resources/images/icons/cross_grey_small.png" title="Close this notification" alt="close" /></a>
<div> You have New Lead Notification </div>
</div>
Here is my html code to trigger the ajax notfication message
<label for ="msg">notice</label>
<input type="text" name ="msg" id ="msg" />
<a href ="#" id="getNotice"> get notice!</a>
<script type = "text/javascript">
$(function()
{
$("#getNotice").click(function()
{
$.post("/async/getnotification" , {},
function(response)
{
var notice = $(response);
$("#notices").prepend(notice);
});
return false;
});
});
</script>
<div id ="notices">
</div>
Here is the javascript code to trigger the close function for the close button
$(".close").click(
function () {// Links with the class "close" will close parent
$(this).parent().fadeTo(400, 0, function () {
$(this).slideUp(400);
});
return false;
}
);