title: How to add multiple values to a key in local storage
body: <p>Im trying to allow a user to select multiple select options that can be stored in local storage.
  Trying to allow users to choose multiple select options that get saved and are displayed on screen.</p>
  <p>html</p>
  <pre><code>   &lt;body&gt;
      &lt;div class=&quot;custom_tunings&quot;&gt;
          &lt;h1&gt;Custom Tunings&lt;/h1&gt;
          &lt;br&gt;
          &lt;fieldset&gt;
              &lt;legend&gt;Add New Tunings&lt;/legend&gt;
              &lt;div class=&quot;formBox&quot;&gt;
                  &lt;label for=&quot;&quot;&gt;Tuning Name&lt;/label&gt;
                  &lt;input type=&quot;text&quot; id=&quot;inpkey&quot; placeholder=&quot;Insert Name&quot;&gt; &lt;br&gt;
              &lt;/div&gt;
              &lt;form class=&quot;&quot; action=&quot;index.html&quot; method=&quot;post&quot;&gt;
                  &lt;div class=&quot;formBox&quot;&gt;
                      &lt;select class=&quot;mynoteslist&quot; id=&quot;inpvalue&quot;&gt;
                          &lt;option value=&quot;A1&quot;&gt;A1&lt;/option&gt;
                          &lt;option value=&quot;B1&quot;&gt;B1&lt;/option&gt;
                          &lt;option value=&quot;C1&quot;&gt;C1&lt;/option&gt;
                          &lt;option value=&quot;D1&quot;&gt;D1&lt;/option&gt;
                          &lt;option value=&quot;E1&quot;&gt;E1&lt;/option&gt;
                          &lt;option value=&quot;F1&quot;&gt;F1&lt;/option&gt;
                          &lt;option value=&quot;G1&quot;&gt;G1&lt;/option&gt;
                      &lt;/select&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;formBox&quot;&gt;
                      &lt;select class=&quot;mynoteslist&quot; id=&quot;inpvalue2&quot;&gt;
                          &lt;option value=&quot;A1&quot;&gt;A1&lt;/option&gt;
                          &lt;option value=&quot;B1&quot;&gt;B1&lt;/option&gt;
                          &lt;option value=&quot;C1&quot;&gt;C1&lt;/option&gt;
                          &lt;option value=&quot;D1&quot;&gt;D1&lt;/option&gt;
                          &lt;option value=&quot;E1&quot;&gt;E1&lt;/option&gt;
                          &lt;option value=&quot;F1&quot;&gt;F1&lt;/option&gt;
                          &lt;option value=&quot;G1&quot;&gt;G1&lt;/option&gt;
                      &lt;/select&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
              &lt;button type=&quot;button&quot; id=&quot;btninsert&quot;&gt;Save Tuning &lt;/button&gt;
              &lt;br&gt;
          &lt;/fieldset&gt;
          &lt;fieldset&gt;
              &lt;legend&gt;My Tunings&lt;/legend&gt;
              &lt;div id=&quot;isoutput&quot;&gt; &lt;/div&gt;
          &lt;/fieldset&gt;
      &lt;/div&gt;
  
  </code></pre>
  <p>Im trying add multiple inpvalues to a key.
  I cant seem to add another inpvalue as it seems to only accept the first value.
  Im wondering if theres a simple way around this?</p>
  <p>javascript</p>
  <pre><code>let inpkey = document.getElementById(&quot;inpkey&quot;);
  let inpvalue=document.getElementById(&quot;inpvalue&quot;);
  //let inpvalue2=document.getElementById(&quot;inpvalue2&quot;);
  
  
  
  let btninsert = document.getElementById(&quot;btninsert&quot;);
  let isoutput = document.getElementById(&quot;isoutput&quot;);
  
  btninsert.onclick = function(){
    let key = inpkey.value;
    let value = inpvalue.value;
    //let value2 = inpvalue.value;
  
    console.log(key);
    console.log(value);
  //console.log(value2);
  
    if(key &amp;&amp; value) {
      localStorage.setItem(key,value);
      location.reload();
    }
  };
  for(let i=0; i&lt;localStorage.length; i++){
    let key=localStorage.key(i);
    let value=localStorage.getItem(key);
  
  
  
    isoutput.innerHTML += `${key}: ${value}  &lt;br&gt;` ;
  }
  </code></pre>
  <p>the desired output would be something like this
  Howver if i try to select different options it only takes the first value and applies them to all.</p>
  <p><a href="https://i.stack.imgur.com/TG0xU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TG0xU.png" alt="enter image description here" /></a></p>