JSFiddle - React, Tailwind, and code Playground

by adelura

HTML

<p id="foo"> ijij OD-3495 Ofodif OD-33 o</p>

JavaScript

// var textnode = foo.firstChild;
// var replacementNode = textnode.splitText(1);

function splitAt(node, ...indexes) {
	let result = [];
	indexes = Array.from(indexes).reverse();

	indexes.forEach(function (index) {
    	result.unshift(node.splitText(index));
    });
    
    result.unshift(node);
    
    return result;
}

function wrapIntoA(node) {
	let a = document.createElement('a');
    a.appendChild(node);
    a.setAttribute('href', 'http://google.com');

    return a;
}

function getIndexes(str, re) {
    let matches = [];

	while ((match = re.exec(str)) != null) {
        matches.push([
        	match.index,
            match.index + match[0].length
        ]);
		console.log(match);
	}

    return matches;
}

var b = getIndexes(foo.firstChild.textContent, /(OD-\d*)/g)[0];
let nodes = splitAt(foo.firstChild, b[0], b[1]);
let a = wrapIntoA(nodes[1]);

foo.insertBefore(a, nodes[2]);