JSFiddle - React, Tailwind, and code Playground

JavaScript

var content = '<p>7</p><p>77</p><p><br></p><p><a href="http://example.com" rel="nofollow">http://example.com</a></p><p><br></p><p><a href="example.com" target="_blank">example.com</a></p><p><br></p><p><a href="ftp://localhost">ftp://localhost</a></p><p><br></p><p><a href="localhost">localhost</a><br></p>';

var addProtocolToLinks = function(URL){
	var protocols = ['http', 'https', 'ftp', 'sftp', 'ssh', 'smtp'];
	var withProtocol = false;
	if (URL.length > 0){
	  protocols.forEach(function(el) {
	    if (URL.slice(0,4).indexOf(el) > -1){
	      withProtocol = true;
	    }
	  });
	  var newURL =  URL;
	  if (!withProtocol){
	    newURL = 'http://' + URL;
	  }
	  console.log(newURL + '   ' + URL);
	  return newURL;
	}
};

var parser = new DOMParser();
var doc = parser.parseFromString(content, "text/html");
var links = doc.getElementsByTagName("a");
for(var i=0; i<links.length; i++) {
    links[i].setAttribute('href', addProtocolToLinks(links[i].href));
    console.log('result: ' + links[i].getAttribute('href'));
}

console.log('result html: ');
console.log(doc);  // also i need to fetch only my var content part, without html, body etc