Displaying a div when button is clicked Javascript

My goal is to display a div with a successfull message when the Save button is clicked. Unfortunately, all I managed to do is display this message everytime the page is loaded..

Here is my code :

<div id="fadeDiv">
    <p>Content saved !</p>
</div>

$(document).ready(function () {
    $('#fadeDiv').fadeIn(1000);
    setTimeout(function () { $('#fadeDiv').fadeOut(1000); }, 1000);
});

I tried to do

$('#saveBtn").click(...);

but when I click on the button, the page is reload even if I don’t have a Response.Redirect() so my div is not displayed.

Thanks for your help

Answer

Thank you all for your fast answers ! I manage to do it !

So I put my button in an asp UpdatePanel to avoid the fact that when it was clicked, the page was reloaded. After that I add a RegisterStartupScript in the C# function called when the button was clicked. Finally, the RegisterStartupScript is simply calling the Javascript function that manage the display of my message.

Here is the code :

HTML

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button ID="saveBtn" runat="server" Text="Save" OnClick="saveBtn_Click"/>
    </ContentTemplate>
</asp:UpdatePanel>
<div id="fadeDiv" style="display: none">
    <p id="saveMsg">Content saved</p>
</div>

C#

protected void saveBtn_Click(object sender, EventArgs e)
{
    // ...
    ScriptManager.RegisterStartupScript(this.Page, this.GetType(), "call", "displaySaveMsg();", true);
}

Javascript

function displaySaveMsg() {
    $('#fadeDiv').fadeIn(1000);
    setTimeout(function () { $('#fadeDiv').fadeOut(1000); }, 1000);
}