So I have this so far:

In the <head> area:

Code:
  <script type="text/javascript" src="jquery.min.js"></script>
<script>
function hyperlink(url)
{
$( '#weather_infos' ).fadeOut(1000);
window.location.href = url;
}
</script>
In the <body> area:

Code:
<li><button onclick="javascript: hyperlink('index.php?page=months')">Months</a></li>
All I want to do is to fade out the main content in the div named "weather_infos" and then go to the page requested. But it executes all in one go. It does not wait for the animation to play out.

How to fix?

Thanks for reading.