Div tag onclick event problem

I have set a div tag so that it can be clicked to navigate the user to a different part of the website, making the whole tag like a giant button;
<div id="foo" onclick="javascriptFuntion();">Text for the user</div>

this is fine however this div tag also contains a button.
<div id="foo" onclick="javascriptFuntion();">Text for the user<input type="submit" onclick="aDifferentFunction();" class="button"></div>

The functionality I want is that when the button is pressed only the button click event runs, not the div onclick event. When I click the button I always get redirected to the location specified by "javascriptFuntion();" (the "aDifferentFunction();" also runs)

Thanks