jQuery.uniqueSort() method

The $.uniqueSort() method is used to sort an array of DOM elements and remove the duplicates. It returns the sorted array after removing the duplicates.

This method searches through the array of objects, sorts the array, and removes the duplicate nodes. The node which is exactly the same as the node already existing in the array is considered to be the duplicate node. If nodes are different, but their attributes are the same will not be considered duplicates.

Syntax

This method accepts a single parameter which is defined as follows -

array: It is the array of DOM elements.

Example

It is a simple example of using the $.uniqueSort() method. In this example, initially, there are two paragraph elements related to the para class. But we are using the .concat() method to create the duplicates of the paragraphs with class = "para". So, the $.uniqueSort() method will remove the duplicates created using the .concat() method.

<!DOCTYPE html>
<html>
<head>
<title> jQuery uniqueSort() method </title>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"> </script>
<style>
p {
color: darkred;
}
</style>
</head>

<body>

<h3> It is an example of using the uniqueSort() method. </h3>
<p id = "p1"> </p>
<p class = "para"> </p>
<p class = "para"> </p>
<p id = "p2"> </p>

<script>
$(document).ready(function(){
var paras = $(".para").get();
paras = paras.concat($(".para").get());
$("#p1").text(" Paragraph Elements with class='para' before applying the uniqueSort() method: " + paras.length);
paras = jQuery.uniqueSort(paras);
$("#p2").text(" Paragraph Elements with class='para' after applying the uniqueSort() method:  " + paras.length + " with the duplicates removed") .css("color", "darkblue");
})

</script>
</body>

</html>

Test it Now

Output

The output initially shows the 4 paragraph elements related to the class para, in which 2 are created using the .concat() method.