JSFiddle - React, Tailwind, and code Playground

HTML

<input name="username" />
<input name="password" />
<input type="submit" />
<button id="clear" />clear</button>
<div>
    <label>Users</label>
    <p id="users"></p>
</div>

JavaScript

//Sets users to Object
var users = {};

//if Users is in local Storage, Grabs It
if(localStorage.getItem('users') != null){
    users = JSON.parse(localStorage.getItem('users'));
    display();
}


 function submitSignUp() {
     var usr = $('input[name=username]').val();
     var pass = $('input[name=password]').val();
     
     //sets username as key and password as value
     //this way you can call a user and set even more information for them
     users[usr] = pass;

     //Sets local storage object as string
     localStorage.setItem('users', JSON.stringify(users));
     
     display();
 }

//displays users object
 function display() {
     $('#users').html`(JSON.stringify(users));
 }

//event handler for submit button
 $('input[type=submit]').click(function (e) {
     e.preventDefault();
     submitSignUp();
 });

//clears user list
$('#clear').click(function(){
    users = {};
    localStorage.setItem('users', JSON.stringify(users));
    display();
});