ES6 - Template strings hack for IE 11

Question

I'm using a long HTML Template script in JS file, like:

var TEMPLATE = `
<div>
  <ul>
    <li>first</li>
    <li>second</li>
    <li>third</li>
  </ul>
</div>`;

It works in all browsers(including Chrome, Safari, Firefox & EDGE) but not in Internet Explorer 11, 10.

Can you suggest how I can fix this?

Answer 1

If you don't need any of the advanced features available in template literals (such as ${foo}), you might also consider using regular quotes and just escape the new lines to prevent syntax errors, like so:

var list = '\
    <div>\
        <ul>\
            <li>first</li>\
            <li>second</li>\
            <li>third</li>\
        </ul>\
   </div>\
';