JSFiddle - React, Tailwind, and code Playground

HTML

foo
<div id="output"></div>
bar

JavaScript

var htmlString='<div id="myDiv"><a href="http://www.google.com">link 1</a><a href="http://www.duckduckgo.com">link 2</a></div><div id="otherDiv"><a href="http://www.asdf.com">link 3</a><a href="http://www.yahoo.com">link 4</a></div>';

function toJavascriptLinks(element){
    element.href="#";
    element.setAttribute('onclick','console.log("Yeah!");');
    console.log(element.outerHTML);
}

//no innerHTML on documentFragment allowed, yet on it's children it's allowed
var frag = document.createDocumentFragment().appendChild( document.createElement('div') );
frag.innerHTML=htmlString;

var $div = $(frag).children('div#myDiv');

$($div).children("a").each(function(i, element){toJavascriptLinks(element);});


var outp=document.getElementById("output");
outp.innerHTML=frag.innerHTML;