css - Attach an image to any word -

i'd attach images specific words cannot find right css selector so.

i have portion of site displays data it's pulled database, adding classes or id's words not option me. i need css display background image wherever word (or in case, name) found on page.

for example, in following (which pulled database):

<td class="data1"><font face="verdana, arial, helvetica, sans-serif" size="1">patrick</font></td> 

i add background image name patrick found.

i tried variations of,

td[.table1 *='parick'] {      background-image:url(../images/accept.png); 

but didn't me anywhere. , since it's not in <span> or <div> or link, can't figure out. if have ideas or jquery workaround, please let me know. thanks!

if can guarantee names appear text nodes in elements, can use simple jquery selector...

$(':contains("patrick")').addclass('name'); 

jsfiddle.

if there may surrounding whitespace and/or search should case insensitive, try...

$('*').filter(function() {     return $.trim($(this).text()).tolowercase() == 'patrick'; }).addclass('name'); 

jsfiddle.

if need find name anywhere in text node , need wrap element, try...

$('*').contents().filter(function() {     return this.nodetype == 3; }).each(function() {     var node = this;     this.data.replace(/\bpatrick\b/i, function(all, offset) {         var chunk = node.splittext(offset);         chunk.data = chunk.data.substr(all.length);         var span = $('<span />', {             'class': 'name',             text:         });         $(node).after(span);     }); });​ 

jsfiddle.

i recommend using third example.