CODEWITHSUNDEEP
jquery
MShack
MShack

Reputation: 652

Replace several different text words each with a different image

I don't have access to change any of this sites HTML and i'm not very knowledgeable with jQuery , but i'm assuming this is very possible.

I have a table that contains several different user names

<table id="chat">
<td>Tim Burton</td>
<td>Dorethea Rose</td>
<td>Selma Jeerik</td>
</table>

I would like to find each user name within this table ONLY and change each name to a avatar of my choosing.

I saw this script , but clueless on how to modify for my needs

("*").each(function () { 
   if ($(this).children().length == 0) {
      var newHTML = $(this).html().replace('basketball','<img src = "image.jpg" />');
      $(this).html(newHTML);
   } 
});

Upvotes: 0

Views: 40

Answers (2)

PeterKA
PeterKA

Reputation: 24638

Something in the the lines of the following may do it:

var name = 'Tim Burton';
$('#chat').find('td').filter(function() { return $(this).text() == name; })
.html( '<img src="url-of-avatar-of-your-choosing.jpg"/>' );

If you want to use the same avatar and the table contains names only then you may want to use simpler code:

$('#chat 'td').html( '<img src="url-of-avatar-of-your-choosing.jpg"/>' );

But if you have the names and avatar in an array/object, then you may loop through the names and use the code at the top:

$.each(names,function(i, name) {
    $('#chat').find('td').filter(function() { return $(this).text() == name; })
    .html( '<img src="url-of-avatar-of-your-choosing.jpg"/>' );
});

Upvotes: 1

meni181818
meni181818

Reputation: 1101

try this:

$( "#chat" ).html( $( "#chat" ).html().replace('Tim Burton', '<img src="image.jpg" />') );

Upvotes: 1

Related Questions