jQuery :contains() Selector

The jQuery :contains() selector selects the elements containing the specified matching text content. It can be useful when you want to filter the content from the group element. After selecting the elements, you can highlight them by adding a background color or any other effect.

jQuery :contains() Selector Syntax

The syntax of the jQuery :contains selector is given below.


It requires a single string argument which should be a string. The description of the argument is given below.

Parameter Description

Sr No Parameter Name Description
1 text
  • Specify the text in a string format to select the containing element.
  • Required
  • Case sensitive

You can make it more clear with the examples given below.

use jQuery :contains() Selector to Select Table Cells

There are much contents in the cells of a table. You may want to select the cell items contains the matching text content. Background color is helpful to differentiate the matching items from other cells.

The below example is selecting only the cells contains the text ‘keeper’.


Test it Live


Sr No Name
1 Bookkeeper
2 Housekeeper
3 Monitor
4 Tea Maker
5 Doorkeeper
6 New York
7 Boat

The above example contains the text content in the table and a button. When you click the button, it selects and applies the ‘orange’ color to the cell content contains the word ‘keeper’. You can apply a background color or other effects using jQuery.

Select Matching List Items Containing the Text Content

Suppose there are 8 list items and you want to select the items containing the text ‘maker’. You can use the selector as given in the example below. The example contains the list element and the button to select items on click.


Test it Live


  • Shoemaker
  • Coffeemaker
  • Map Analysis
  • Laser Printer
  • Icemaker
  • Mouse
  • Monitor
  • Carmaker

You have to click the button given in the example above to select the list items. It applies the ‘red’ color to the items contains the text ‘maker’.