Highlight text inside html with jQuery

by

I fiddled some RegEx which allows HTML tags at the position of whitespace chars: 

<div id="test">this is <a href="#">my</a> text that needs highlighting</div>

JavaScript:

var src_str = $("#test").html();
var term = "my text";
term = term.replace(/(\s+)/,"(<[^>]+>)*$1(<[^>]+>)*");
var pattern = new RegExp("("+term+")", "i");

src_str = src_str.replace(pattern, "<mark>$1</mark>");
src_str = src_str.replace(/(<mark>[^<>]*)((<[^>]+>)+)([^<>]*<\/mark>)/,"$1</mark>$2<mark>$4");

$("#test").html(src_str);

Try it here: http://jsfiddle.net/UPs3V/

More Related Contents:

  1. How do you make an element “flash” in jQuery
  2. Highlight dates in specific range with jQuery’s datepicker
  3. JQuery search in static HTML page with highlighting of found word
  4. Wrap some specified words with span in jQuery?
  5. jQuery Adding new option to select element doesn't pick up the string [closed]
  6. How can I create a “Please Wait, Loading…” animation using jQuery?
  7. Serialize form data to JSON [duplicate]
  8. Difference between $(window).load() and $(document).ready() functions
  9. jQuery get mouse position within an element
  10. JSONP with ASP.NET Web API
  11. Click outside menu to close in jquery
  12. jQuery text fade/transition from one text to another?
  13. Invoking a jQuery function after .each() has completed
  14. How to make a hover effect for pseudo elements?
  15. jQuery is not defined in bootstrap-sass
  16. Append text to input field
  17. Find html element which id starts with
  18. What does !function ($) { $(function(){ }) }(window.jQuery) do?
  19. Mobile Safari bug on fixed positioned button after scrollTop programmatically changed…?
  20. calculate the number of html checkbox checked using jquery
  21. Check, using jQuery, if an element is ‘display:none’ or block on click
  22. JQuery: Selecting dynamically created elements and pushing to Firebase
  23. Jquery dependent drop down boxes populate- how
  24. How to pass values arguments to modal.show() function in Bootstrap
  25. How to simplify my statefull interlaced modal dialogs in ASP.NET MVC
  26. CSS issue on Twitter Typeahead with Bootstrap 3
  27. Difference between find and filter
  28. How to send data in jquery.post to mvc controller which use ViewModel as parameter?
  29. Detecting IE using jQuery
  30. change img src on click

Leave a Comment