0

Here is example existing HTML , i'm not authorized to alter

<a target="new" href="#">KCC&nbsp;26&nbsp;v&nbsp;MIN&nbsp;23</a>

Trying to add some NFL icons in leu of the abbr names for each

so i tried this out to test for KCC text found anywhere on the page but doesn't work. Any ideas ? So i'd like to leave all existing HTML the same and grab some team abbr text names and replace with an icon. In the above HTML i would replace KCC and MIN with 2 different images.

$("*").filter(function() { return !$(this).children().length; })
      .html(function(index, old) { return old.replace('KCC', '<img ... />'); });
MShack
  • 642
  • 1
  • 14
  • 33

1 Answers1

0

Try this code https://jsfiddle.net/zn9fy1p6/1/

var aTags = document.getElementsByTagName("a");
for (var i = 0; i < aTags.length; i++) {
  if (aTags[i].textContent.indexOf("KCC")>=0) {
       aTags[i].textContent = aTags[i].textContent.replace('KCC', '<img ... />');
  }
}

If you would like to replace multiple sub strings, KCC with one image and MIN with another image, then you should try something as below https://jsfiddle.net/doteLm39/

var mapObj = { 
  KCC:'<img ... />', //image-1
  MIN:'<img ... />' // image-2
};

var aTags = document.getElementsByTagName("a");
for (var i = 0; i < aTags.length; i++) {       
  aTags[i].textContent = replaceAll(aTags[i].textContent, mapObj);
}

function replaceAll(str,mapObj){
  var re = new RegExp(Object.keys(mapObj).join("|"),"gi");
  return str.replace(re, function(matched){
     return mapObj[matched];
  });
}
Murali Nepalli
  • 1,588
  • 8
  • 17
  • great thanks , how would i add another text replace in that , if i wanted to replace KCC with 1 image and MIN with another image ? – MShack Nov 06 '19 at 06:54
  • @MShack: I Updated the code. I borrowed little from https://stackoverflow.com/questions/15604140/replace-multiple-strings-with-multiple-other-strings – Murali Nepalli Nov 06 '19 at 23:25