Another set of useful jQuery selectors are the content filter selectors.
These selectors allow you to select HTML elements based on the content inside the HTML element.
The syntax is $(“E:contains(value)”).
<!DOCTYPE html>
<html>
<head lang='en'>
<meta charset='UTF-8'>
<title>Codecrawl.com-Image</title>
<script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'></script>
<script>
$(function () {
$("h4:contains('Ushuaia')").css('color', 'blue');
});
</script>
</head>
<body>
<div>
<h4>Ushuaia</h4>
<p>Southernmost city in the world.</p>
<img src='//codecrawl.com/code/images/ushuaia.jpg' height="200px">
</div>
</body>
</html>
If we make a slight change to the element by changing h4 to div, all content inside the div will be selected.
$("div:contains('Ushuaia')").css('color', 'blue');