Find certain text on page and make it underlined

Question

How do I find certain text on my web page and make it underlined?

For example, I have some text on my page and I want to find all the words hello and make them underlined.

My trial code is:

$( "body:contains('hello')" ).css( "text-decoration", "underline" );

But this ends up underlining the whole line instead of just that word.

is there any specific `class , id , div , span` around that text? show your code then only we can suggest the solution. — Richa, Mar 06 '14 at 09:29
Related helpful post http://stackoverflow.com/questions/926580/find-text-string-using-jquery — rakeshjain, Mar 06 '14 at 09:30
@Era, that's the problem, the hello word could be in any html tag. — oshirowanen, Mar 06 '14 at 09:32

score 3 · Accepted Answer · answered Mar 06 '14 at 09:31

3

Try this.

HTML

<p>For example, I have some text on my page and I want to find all the words hello and make them bold.</p>

Script

$('p').html( $('p').html().replace(/hello/g, '<strong>hello</strong>') )

answered Mar 06 '14 at 09:31

Rakesh Kumar

This will only work with P tags, I need it to work on all html tags. – oshirowanen Mar 06 '14 at 09:33
`$('p')` change to `$('*')`. – Jai Mar 06 '14 at 09:34
1

@oshirowanen you need to take some initiative... There is one problem here, you'll loose all events bound to children of targeted elements, if any – A. Wolff Mar 06 '14 at 09:35

monu · Answer 2 · 2014-03-06T09:45:44.470

1

 $('body').html($('body').html().replace(/hello/g, '<strong>hello</strong>') )

edited Mar 06 '14 at 09:45

answered Mar 06 '14 at 09:31

monu

this won't work! he want to make it bold not to add border to whole sentence. – Mar 06 '14 at 09:33
This kind of works because I replaced the css with "`font-weight","bold"`, however, instead of making that single word bold, it makes the whole line bold. – oshirowanen Mar 06 '14 at 09:34

score 0 · Answer 3 · answered Mar 06 '14 at 09:33

0

$(function() {
     $('*:contains("hello")').css( "text-decoration", "underline");
});

please review this code

answered Mar 06 '14 at 09:33

Karthick Kumar

3 Answers3