Working with a 3rd party product I can manipulate the dom using javascript inside the product. I can do sort of:
var foo = document.getElementById("foo");
var listItem = document.createElement("li");
foo.appendChild(listItem);
//etc...
This gets pretty messy fast. I'd like to use a html templating engine, but when I investigate alternative all assumes I have "control" over the html, which I don't.
I'd like to render/build html, javascript using an engine and then inject it into the 3rd party product.
Any suggestions?
(My apologies if the question is unclear. I'm not sure what I'm looking for)
I've figured out what I was looking for: client side javascript template engine!
Here's an example using ejs:
let ejs = require('ejs');
let data = ['geddy', 'neil', 'alex'];
let template = `<ul>
<% for(let i = 0; i < people.length; i++) { %>
<li>
<%= people[i] %>
</li>
<% } %>
</ul>
`;
let html = ejs.render(template, {people: data});
var foo = document.getElementById("foo");
foo.innerHTML = html;
Hope this helps someone in the future. Happy coding!