JSFiddle - React, Tailwind, and code Playground

HTML

<form action='javascript:alert(0)'>
<input name="Team1" id="team1" type="text" value="Team1?">
<button id="dostuff" value="Go">Go</button>
</form>

<div id ="nicteamcolumn">Team: </div>

<script>
    
$('#dostuff').click(function(e) {
    e.preventDefault();
    var team1 = $('input[name="Team1"]').val();
    if (typeof Storage !== "undefined") {
        // Will always show an array:
        var teamlist = JSON.parse(localStorage.getItem('teamlist') || '[]');
        teamlist.push(team1);
        localStorage.setItem('teamlist', JSON.stringify(teamlist));
        $('#nicteamcolumn').html("Team:<br>" + teamlist.join('<br>') + "<br>");
    }
});

    $('<button>Clear storage<\/button>').click(function(e){
    e.preventDefault();
    localStorage.removeItem('teamlist');
    alert('Removed localStorage.teamlist');
}).insertAfter('#dostuff');
</script>