jQuery :lang() selector

The :lang() selector is used to select the elements with the specified language code. It selects the elements whose language value is equal to the supplied language code. This selector can also select the elements whose language value starts with the supplied language immediately followed by a hyphen ("-"). We can use the lang attribute in HTML to determine the language value of the elements.

For example, suppose we are using $("p:lang(en)"), so the selector will only select those paragraph elements whose language value is either en or start with en such as en-us, en-uk, etc., i.e., <p lang = "en"> and <p lang = "en-us">, but it will not select <p lang = "fr"> or any other paragraph element whose language value is different from the supplied language code.

Syntax

This parameter accepts a single parameter language that specifies the language code.

Example

In this example, we are using the :lang() selector to select the paragraph elements whose language code is either en or start with en.

<!DOCTYPE html>
<html>

<head>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script>
<script>
$(document).ready(function() {
$("button").click(function() {
$("p:lang(en)").css("background-color", "lightgreen");
});
});
</script>
</head>

<body>
<h1> Welcome to the javaTpoint.com </h1>
<h2> It is an example of jQuery :lang() selector. </h2>
<p lang = "en"> This is first paragraph with lang = "en". </p>
<p lang = "fr"> This is second paragraph with lang = "fr". </p>
<p lang = "en-us"> This is third paragraph with lang = "en-us". </p>
<div lang = "es-es"> This is fourth paragraph with lang = "es-es". </div>
<h3> Click the following button to select the elements with language code en </h3>
<button> Click me </button>
</body>

</html>

Test it Now

Output

After the execution of the above code, the output will be -