How to remove specific value from array using jQuery ? - GeeksforGeeks

24 Apr, 2020
Given an array elements and the task is to remove the specific value element from the array with the help of JQuery. There are two approaches that are discussed below:
Approach 1: We can use the not() method which removes the element that we want. Later, use get() method to get the rest of the elements from the array.
Example:<!DOCTYPE HTML><html>  <head>    <title>        Remove certain property for all objects        in array with JavaScript.    </title>      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">    </script></head>  <body style="text-align:center;">      <h1 style="color: green">        GeeksForGeeks    </h1>      <p id="GFG_UP"></p>      <button onclick="gfg_Run()">        Click Here    </button>      <p id="GFG_DOWN" style="color:green;"></p>      <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var arr = ["GFG", "GeeksForGeeks", "Geek", "Geeks"];        var remEl = "Geek";        el_up.innerHTML = "Click on the button to perform "                + "the operation.<br>Array - [" + arr + "]";                          function gfg_Run() {            var arr2 = $(arr).not([remEl]).get();            el_down.innerHTML = "[" + arr2 + "]";        }     </script></body>  </html>
<!DOCTYPE HTML><html>  <head>    <title>        Remove certain property for all objects        in array with JavaScript.    </title>      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">    </script></head>  <body style="text-align:center;">      <h1 style="color: green">        GeeksForGeeks    </h1>      <p id="GFG_UP"></p>      <button onclick="gfg_Run()">        Click Here    </button>      <p id="GFG_DOWN" style="color:green;"></p>      <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var arr = ["GFG", "GeeksForGeeks", "Geek", "Geeks"];        var remEl = "Geek";        el_up.innerHTML = "Click on the button to perform "                + "the operation.<br>Array - [" + arr + "]";                          function gfg_Run() {            var arr2 = $(arr).not([remEl]).get();            el_down.innerHTML = "[" + arr2 + "]";        }     </script></body>  </html>
Output:
Approach 2: We can use the inArray() method to get the index of the element (that is to be removed) and then use slice() method to get the rest of the elements.
Example:<!DOCTYPE HTML><html>  <head>    <title>        Remove certain property for all objects        in array with JavaScript.    </title>      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">    </script></head>  <body style="text-align:center;">      <h1 style="color: green">        GeeksForGeeks    </h1>      <p id="GFG_UP"></p>      <button onclick="gfg_Run()">        Click Here    </button>      <p id="GFG_DOWN" style="color:green;"></p>      <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var arr = ["GFG", "GeeksForGeeks", "Geek", "Geeks"];        var remEl = "Geek";        el_up.innerHTML = "Click on the button to perform "                + "the operation.<br>Array - [" + arr + "]";                          function gfg_Run() {            arr.splice($.inArray(remEl, arr), 1);            el_down.innerHTML = "[" + arr + "]";        }     </script></body>  </html>
<!DOCTYPE HTML><html>  <head>    <title>        Remove certain property for all objects        in array with JavaScript.    </title>      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">    </script></head>  <body style="text-align:center;">      <h1 style="color: green">        GeeksForGeeks    </h1>      <p id="GFG_UP"></p>      <button onclick="gfg_Run()">        Click Here    </button>      <p id="GFG_DOWN" style="color:green;"></p>      <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var arr = ["GFG", "GeeksForGeeks", "Geek", "Geeks"];        var remEl = "Geek";        el_up.innerHTML = "Click on the button to perform "                + "the operation.<br>Array - [" + arr + "]";                          function gfg_Run() {            arr.splice($.inArray(remEl, arr), 1);            el_down.innerHTML = "[" + arr + "]";        }     </script></body>  </html>
Output:
CSS-Misc
HTML-Misc
JavaScript-Misc
CSS
HTML
JavaScript
Web Technologies
Web technologies Questions
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Design a web page using HTML and CSS
Form validation using jQuery
Search Bar using HTML, CSS and JavaScript
How to set space between the flexbox ?
How to Create Time-Table schedule using HTML ?
How to set the default value for an HTML <select> element ?
How to set input type date in dd-mm-yyyy format using HTML ?
How to Insert Form Data into Database using PHP ?
Hide or show elements in HTML using display property
REST API (Introduction)