How to change a word in a h2 when certain page is clicked on

I'm trying to change a certain word in the title of a page dynamically with javascript depending on which link in the nav is clicked on. So for instance, if the "Asia" link is clicked I want the h2 to display: "You are in Asia" or if the "Europe link is clicked I want the h2 to say: "You are in Europe."

The html for the nav bar:

<div id="zone-nav">
<a href="" id="surge-btn"</a>
<a href="" id="latin-btn"</a>
<a href="" id="africa-btn"</a>                  
<a href="" id="asia-btn"</a>                    
</div>

The html I have thus far for the title that needs to be changed: `

<h2 id="zoneName">You are in<span id="zoneName"></span></h2>`

I know I need to write a function to determine what link is pressed, but I am a little confused on how to approach this.