Basic Template literals

template-literals-basics.js

var copy = {
  title: 'Discovering Template Literals',
  subtitle: 'Effortless client-side rendering awaits.',
  body: 'You will never want to go back to normal strings again.'
}

var element = document.createElement('section')
element.innerHTML = `
  <div class="content">
    <h1>${copy.title}</h1>
    <p class="subtitle">${copy.subtitle}</p>
    <p>${copy.body}</p>
  </div>
`
/*
  Results:
    <section>
      <div class="content">
        <h1>Discovering Template Literals</h1>
        <p class="subtitle">Effortless client-side rendering awaits.</p>
        <p>You will never want to go back to normal strings again.</p>
      </div>
    </section>
*/