JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>


<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">


<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>


<ul class="nav nav-pills">
  <li>
    <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">Dropdown</a>
    <ul class="dropdown-menu">
      <div class="container">
        <ul class="nav nav-pills" id="tabs">
          <li class="active"><a href="#HRsup">Suporte</a></li>
          <li><a href="#HRuni">Unidades</a></li>
        </ul>
      </div>
      <div class="tab-content">
        <div id="HRuni" class="tab-pane fade">
          <center>
            <br>
            <br>
            <table class="table tabela">
              <tbody>
                <tr>
                  <td>
                    <div><b>Brasil (SC,PR,SP,RJ,ES,MG,GO,DF,MT,MS)&nbsp;&nbsp;</b></div>
                  </td>
                  <td>
                    <span id="timebr">8:50:29 AM </span>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div><b>Brasil (Demais UF)</b></div>
                  </td>
                  <td>
                    <span id="timebr1">8:50:30 AM </span>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div><b>Argentina</b></div>
                  </td>
                  <td>
                    <span id="timear">8:50:30 AM </span>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div><b>Bolivia</b></div>
                  </td>
                ...

JavaScript

var weekdaystxt = ["Domingo", "Segunda", "Terça", "Quarta", "Quinta", "Sexta", "Sábado"]

function showLocalTime(container, servermode, offsetMinutes, displayversion) {
  if (!document.getElementById || !document.getElementById(container)) return
  this.container = document.getElementById(container)
  this.displayversion = displayversion
  var servertimestring = (servermode == "server-php") ? 'March 01, 2016 10:37:03' : (servermode == "server-ssi") ? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
  this.localtime = this.serverdate = new Date(servertimestring)
  this.localtime.setTime(this.serverdate.getTime() + offsetMinutes * 60 * 1000) //add user offset to server time
  this.updateTime()
  this.updateContainer()
}

showLocalTime.prototype.updateTime = function() {
  var thisobj = this
  this.localtime.setSeconds(this.localtime.getSeconds() + 1)
  setTimeout(function() {
      thisobj.updateTime()
    }, 1000) //update time every second
}

showLocalTime.prototype.updateContainer = function() {
  var thisobj = this
  if (this.displayversion == "long")
    this.container.innerHTML = this.localtime.toLocaleString()
  else {
    var hour = this.localtime.getHours()
    var minutes = this.localtime.getMinutes()
    var seconds = this.localtime.getSeconds()
    var ampm = (hour >= 12) ? "PM" : "AM"
    var dayofweek = weekdaystxt[this.localtime.getDay()]
    this.container.innerHTML = formatField(hour, 1) + ":" + formatField(minutes) + ":" + formatField(seconds) + " " + ampm + " "
  }
  setTimeout(function() {
      thisobj.updateContainer()
    }, 1000) //update container every second
}

function formatField(num, isHour) {
  if (typeof isHour != "undefined") { //if this is the hour field
    var hour = (num > 12) ? num - 12 : num
    return (hour == 0) ? 12 : hour
  }
  return (num <= 9) ? "0" + num : num //if this is minute or sec field
}


new showLocalTime("timebr", "server-php", 0, "short")
new...