<div class="hide">
                    <ul>
                        <li>One</li>
                        <li>Two</li>
                        <li>Threw</li>
                    </ul>
</div>
// setTimeout(function(){
//   document.getElementById("hide").style.display = "block"; 
//  }, 27000);


window.addEventListener('load', () => {

  // Either add a class to the body and do the rest
  // using CSS animations...
  document.body.classList.add('loaded')

  // ... or just start the timeout now
  window.setTimeout(() => {
    document.querySelector('.hide').classList.remove('hide')
  }, 27000)
})
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.