jQuery Plugin To Highlight Searched Text In A Certain Container - highlight.js

Just another text highlighting plugin that highlights matched text/words with custom styles in a specific container. useful in your search result page to highlight user searched terms.

How to use it:

1. Include the latest jQuery library and jQuery highlight.js script on the webpage.

<script src="//code.jquery.com/jquery-3.1.0.slim.min.js"></script>
<script src="js/jQuery.highlight.js"></script>

2. The example JavaScript to highlight the text 'hello' within the container '#selector'.

$('#selector').highlight('hello');

3. Restrict the plugin to highlight the whole word instead of matched text.

$('#selector').highlight('hello',{
  wholeWord: true // or false
});

4. Determine whether to ignore the case of the specified text/word.

$('#selector').highlight('hello',{
  ignoreCase: true // or false
});

5. Change the default styles of the highlighted text/word.

$('#selector').highlight('hello',{
  background: "#ffff00",
  color: "#000",
  bold: false,
});

6. Add an extra CSS class to the highlighted text/word.

$('#selector').highlight('hello',{
  class: "custom-class"
});

---

This awesome jQuery plugin is developed by itay-grudev. For more Advanced Usages, please check the demo page or visit the official website.