Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Using the <template> Element</title> </head> <body> <template id="my-template"> <div class="card"> <h2>Title</h2> <p>Content goes here...</p> </div> </template> <button id="show-template">Show Template</button> <div id="content"></div> <script> document.getElementById('show-template').addEventListener('click', () => { const template = document.getElementById('my-template'); const content = document.getElementById('content'); const clone = document.importNode(template.content, true); content.appendChild(clone); }); </script> </body> </html>