0

I would like to know how to highlight in yellow only the plus sign (+) of a string using jQuery.

For example:
Text: Lorem ipsum dolor sit amet, consectetur adipiscing elit +

Daniel
  • 63
  • 4

2 Answers2

1

Well, This is the most simplest way to do it, I guess. Just use a span tag and enclose whatever it is you want to change. Give it an id. Finally change the css property using that id.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $("#colouring").css("color","yellow");
});
</script>
</head>
<body>

<p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit <span id="colouring">+</span>
</p>

</body>
</html>
Andrey Tretyak
  • 3,043
  • 2
  • 20
  • 33
flatbreadcandycane
  • 357
  • 4
  • 19
  • Hi, thanks for your suggestion. Yes, this is the better way. The problem is that the code will generate from an old CMS and I cannot add classes or ids as per your suggestion. – Daniel Sep 06 '16 at 06:48
  • Then don't use jquery at all. `

    Lorem ipsum dolor sit amet, consectetur adipiscing elit +

    `     – flatbreadcandycane Sep 06 '16 at 06:51
0

You can replace a specific part of the string and wrap it. For better handling you should use a class and css for highlighting some parts.

var text = $('#myspan').text();
text = text.replace('+', '<span style="color: yellow;">+</span>');
$('#myspan').html(text)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="myspan">Lorem ipsum dolor sit amet, consectetur adipiscing elit +</span>
Tobias S
  • 1,275
  • 8
  • 23