<!doctype html>

<head>

<script src="moment.min.js"></script>
<script src="moment-timezone-with-data.min.js"></script>

<script type="text/javascript">

/***********************************************
* Local Time script- By Dynamic Drive (http://www.dynamicdrive.com)
* Please keep this notice intact
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/


function showLocalTime(container, zoneString, formatString){
var thisobj=this
this.container=document.getElementById(container)
this.localtime = moment.tz(new Date(), zoneString)
this.formatString = formatString
this.container.innerHTML = this.localtime.format( this.formatString )
setInterval(function(){thisobj.updateContainer()}, 1000) //update container every second
}

showLocalTime.prototype.updateContainer=function(){
this.localtime.second(this.localtime.seconds() + 1 )
this.container.innerHTML = this.localtime.format( this.formatString )
}


</script>

</head>
<body>
<div class="bigbox"><b>Toronto:</b> <span id="toronto"></span></div>
<div class="bigbox"><b>Paris:</b> <span id="paris"></span></div>
<div class="bigbox"><b>Vancouver, BC:</b> <span id="vancouver"></span></div>
<div class="bigbox"><b>Johannesburg:</b> <span id="johannesburg"></span></div>

<script type="text/javascript">

new showLocalTime("toronto", "America/Toronto", "hh:mm:ss A (ddd)")
new showLocalTime("paris", "Europe/Paris", "hh:mm:ss A (ddd)")
new showLocalTime("vancouver", "America/Vancouver", "hh:mm:ss A (ddd)")
new showLocalTime("johannesburg", "Africa/Johannesburg", "hh:mm:ss A (ddd)")

</script>
</body>

</html>