从视图中删除消息？

Question

Each time a user clicks un read the div area should remove, below is my HTML and javascript. Whats happening at the moment is that when you click unread it does everything in the back end and not in the front end screen, I think its got to do with my JavaScript line $('#Unreadmessage').closest(".messagearea").remove(); please advise

<div class="alert alert-default alert-dismissible messagearea" role="alert" style="background: rgb(233, 233, 233);">

<button class="close" aria-label="Close" type="button" data-dismiss="alert"><span aria-hidden="true">×</span></button>

<div id="Unreadmessage" class="markmessage" data-messageid="@message.Id">

<p class="small"><i class="fa fa-envelope" aria-hidden="true"></i> Unread</p></div>

<p class="small"><i class="fa fa-calendar" aria-hidden="true"></i> @message.CreatedOn.ToString("dd MMM yyyy")</p>
                                            <p class="small" style="font-weight: bold;"><i class="fa fa-info" aria-hidden="true"></i> Claim ref. @message.CaseNumber</p>

<p>@message.Message <a href="@Url.Action("Details","Enquiry" , new { id = @message.EnquityId })">More.</a></p>

</div>

Below is my Javascript

$("#Unreadmessage").click(function () {
var messageId = $(this).data("messageid"); //need to pass this message ID to controller.
var isread = true; //True by default
//I need to pass the messageID to server which is CRM
$.ajax({
url: "@Url.Action("MarkMessage", "Enquiry")", //Need to add my URl here
type: "POST",
data: { messageId: messageId, isread: true }, //Get messageId and isread values
dataType: "json",
success: function (response) {
 $('#Unreadmessage').closest(".messagearea").remove();  
  }
    });

Answer 1

If you mean removing the content just like clicking x, then that can also be achieved by just placing data-dismiss="alert" at p(the unread container).

To remove just the unread, it will be best to update the back-end to isread(for example) when More is clicked. You then have to decide whether to display Read or displaying nothing.

<p data-dismiss="alert" class="small"><i class="fa fa-envelope" aria-hidden="true"></i> Unread</p>