JSFiddle - React, Tailwind, and code Playground

HTML

Name 1:
<div class="nameTag">Bob</div>
Name 2:
<div class="nameTag">Jim</div>
---
<template id="name-tag">.y.</template>

JavaScript

var nameTags = document.querySelectorAll('.nameTag');
    var template = document.querySelector('template#name-tag');
   
    for (var i = nameTags.length - 1; i >= 0; i--) {
        var shadow = nameTags[i].attachShadow();
        var clone = template.content.cloneNode(true);
        // console.log(nameTags);
        shadow.appendChild(clone);
        // console.log(i, nameTags[i], shadow, template);
    };
    template.remove();