How to Clear Local Storage Using JavaScript

In JavaScript, the “localStorage” is a special property that stores the “key-value” pairs of the JavaScript sites and applications in a web browser with no expiry date. It is mainly used to keep the data persistent. The local storage data is not removed until the user wants to remove it. It remains safe even after the web browser is closed.

This post illustrates all possible methods to clear “local storage” using JavaScript.

How to Clear Local Storage Using JavaScript?

The “clear()” method allows the users to remove the local storage item stored in the current domain i.e., browser. The local storage item is saved with no expiration date. This method removes all of the stored local storage items at once.



The above syntax does not require any additional parameters to clear the local storage items.

Example: Applying the Storage “clear()” Method to Clear All the Local Storage Items

This example explains the practical implementation of the storage “clear()” method to remove all the local storage items. 


First, have a look at the given HTML code:

<h2>Clear Local Storage Using JavaScript</h2>
<h3>Create Items</h3>
<p>Create the local storage items.</p>
<button onclick="create()">Create local storage items</button>
<p id="demo"></p>
<p id="sample"></p>
<p id="para"></p>
<p id="para2"></p>
<h3>Remove Items</h3>
<p>Remove all local storage items.</p>
<button onclick="remove()">Clear items</button>

In the above code lines:

  • The “<h2>” tag adds a first subheading having the “style” attribute that sets the following style attributes on it.
  • The “<h3>” tag specifies a second subheading of level 3.
  • The “<p>” tag creates a paragraph statement.
  • The “<button>” tag adds a button with an attached “onclick” event to execute the function “create()” upon the button click.
  • After that, the next four “<p>” tags add empty paragraphs with their assigned ids to display the created storage items when the event trigger.
  • The next “<h3>” and “<p>” tags specify another heading and paragraph statement.
  • The last “<button>” tag adds another button having an “onclick” event to allow the execution of the “remove()” function.

JavaScript Code

Next, follow the below-given code:

function create() {
 localStorage.setItem("firstname", "Anna");
 document.getElementById("demo").innerHTML = localStorage.getItem("firstname");
localStorage.setItem("lastname", "johnson");
 document.getElementById("sample").innerHTML = localStorage.getItem("lastname");
 localStorage.setItem("age", "22");
 document.getElementById("para").innerHTML = localStorage.getItem("age");
 localStorage.setItem("gender", "female");
 document.getElementById("para2").innerHTML = localStorage.getItem("gender");
function remove() {
 alert("Local Storage items have been cleared");

In the above code snippet:

  • First, the function “create()” applies the “localStorage” property that is associated with the “setItem()” method to set the specified local storage items one by one, respectively.
  • Secondly, the “getElementById()” method is applied one by one to access the empty paragraph using their unique ids to append them with the local storage item “value” that is retrieved through the “getItem()” method via its corresponding “key”.
  • Next, the “remove()” function uses the “clear()” method to remove all the local storage items and then displays the stated message written in the created “alert” box.


The output first creates the specified local storage items and then removes all of them with the help of the “clear()” method upon the “Clear items” button click.


JavaScript offers the “clear()” method to clear the local storage. This method removes all the local storage items at the same item without specifying any of the storage item “keyname”. It makes the removal method of local storage relatively easy as compared to deleting them one by one. This post demonstrated the possible methods to clear the “local storage” using JavaScript.

About the author

Talha Saif Malik

Talha is a contributor at Linux Hint with a vision to bring value and do useful things for the world. He loves to read, write and speak about Linux, Data, Computers and Technology.