I have the following code to load different div with different content by clicking on a link. My question is how can I write so that not reload the page every time I click on a link.

#content > div {
    display: none;
}
#content > div:target {
    display: block;
}
<a href="#div1">Div one</a>
<a href="#div2">Div two</a>
<a href="#div3">Div three</a>
<a href="#div4">Div four</a>

<div id="content">
    <div id="div1">This is div one</div>
    <div id="div2">This is div two</div>
    <div id="div3">This is div three</div>
    <div id="div4">This is div four</div>
</div>