jQuery inArray() method

The jQuery inArray() method is used to find a specific value in the given array. If the value found, the method returns the index value, i.e., the position of the item. Otherwise, if the value is not present or not found, the inArray() method returns -1.

This method does not affect the original array. If the item occurs more than once, the inArray() method returns the index value of the first occurrence. The index of the array begins with 0, so if the value is matched with the first item, the inArray() method returns 0.

Syntax

The inArray() method accepts some parameter values that are defined as follows -

val: It is the item to search for.

arr: It is an array through which to search.

index: It is the array index at which to start the search.

Example1

In this example, we are using the inArray() method to search the specified element from the array. Here, there is an array arr including some elements, and we are finding the item "A" from the array arr. Although the item "A" is occurring many times in the array arr, but the method will return the index of the first occurrence.

<!DOCTYPE HTML>
<html>

<head>
<title> jQuery inArray() method </title>

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script>
</head>

<body>

<h2> Welcome to the javaTpoint.com </h2>
<h3> It is an example of using the jQuery inArray() method </h3>
<p id = "p1"> </p>
<p id = "p2"> </p>
<p> Click the following button to search the specified element. </p>
<button> Click me </button>
<p id = "p3"> </p>

<script>
var arr = ["a", "A", "b", "B", "a", "C", "c", "B"];
var val = "A";
document.getElementById("p1").innerHTML = " <b> The array is: </b> [" + arr + "]";
document.getElementById("p2").innerHTML = " <b> Value to be searched: </b> " + val;
$("button").click(function(){
document.getElementById("p3").innerHTML = " <b> The element is at index position: </b> " + $.inArray(val, arr);
});
</script>
</body>

</html>

Test it Now

Output

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

After clicking the given button, the output will be -

Example2

This example is similar to the previous example, except that here we are using the index parameter of the inArray() method along with other arguments. The method will search the element "A" at index value 4 in the given array arr and will return -1. It is because the string "AA" is present at index value 4 of the array arr.

<!DOCTYPE HTML>
<html>

<head>
<title> jQuery inArray() method </title>

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script>
</head>

<body>

<h2> Welcome to the javaTpoint.com </h2>
<h3> It is an example of using the jQuery inArray() method </h3>
<p id = "p1"> </p>
<p id = "p2"> </p>
<p> Click the following button to search the specified element. </p>
<button> Click me </button>
<p id = "p3"> </p>

<script>
var arr = ["a", "A", "b", "B", "AA", "C", "c", "B"];
var val = "A";
document.getElementById("p1").innerHTML = " <b> The array is: </b> [" + arr + "]";
document.getElementById("p2").innerHTML = " <b> Value to be searched: </b> " + val;
$("button").click(function(){
document.getElementById("p3").innerHTML = " <b> The element is at index position: </b> " + $.inArray(val, arr, 4);
});
</script>
</body>

</html>

Test it Now

Output

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