JSFiddle - React, Tailwind, and code Playground

by Spencer Smith

HTML

<div></div>

CSS

span{
  background-color:lightblue;
}

JavaScript

const regexp = /\[name]|\[location]|\[link]/g;

let str = 'Hey [name], thanks for coming in to [location]! Can you take 30 seconds to leave us a quick review? [link]';

const array = str.match(regexp);

console.log(array)

const span = (str) => (
  `<span>${str}</span>`
);

array.forEach(item => {
  str = str.replace(item, span(item))
});
console.log(str);

const div = document.querySelector("div");

div.innerHTML = str;