title: How to make a list randomizer
body: <p>I have been working on a fairly pointless website where there are multiple "random" generators. You can check it out here: randomwordgen.net16.net
  As you can see there is an unfinished generator at the bottom, that's what I'm here for. I want to get it to generate a list from things you input. My idea is to add the input field's value to the array that will make the list when you hit "Add to List." Then I will have a separate button that will generate the list using that array. The only problem is that I don't know how to add the string to the array when I only know the name of the variable, not the value. If anyone could help me with any of this, that would be great!
  This is the code for the whole site:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DocType html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;link rel="shortcut icon" href="https://cdn2.iconfinder.com/data/icons/thesquid-ink-40-free-flat-icon-pack/64/rubber-duck-512.png" type="image/x-icon"&gt;
  &lt;title&gt;Random Word Generator&lt;/title&gt;
  &lt;style&gt;
  body {
   background-color:pink;
  }
  button.10letter {
   background-color: blue;
  }
  button.5letter {
   background-color: blue;
   position:relative;
   top:50px;
  }
  button.4letter {
   background-color: blue;
   position:relative;
   top:100px;
  }
  button.3letter {
   background-color: blue;
   position:relative;
   top:150px;
  }
  button.Add {
   position:relative;
   top:50px;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;h1 style="color:grey"&gt;Random word generator:&lt;/h1&gt;
  &lt;button class="10letter" onclick="doAlert();" style="color:orange"&gt;Generate with 10 letters.&lt;/button&gt;
  &lt;script&gt;
  function createRandomWord(length) {
      var consonants = 'bcdfghjklmnpqrstvwxyz',
          vowels = 'aeiou',
          rand = function(limit) {
              return Math.floor(Math.random()*limit);
          },
          i, word='', length = parseInt(length,10),
          consonants = consonants.split(''),
          vowels = vowels.split('');
      for (i=0;i&lt;length/2;i++) {
          var randConsonant = consonants[rand(consonants.length)],
              randVowel = vowels[rand(vowels.length)];
          word += (i===0) ? randConsonant.toUpperCase() : randConsonant;
          word += i*2&lt;length-1 ? randVowel : '';
      }
      return word;
  }
  function doAlert() {
  alert( "Your word is: "+createRandomWord(10)+" (bonus points if your word is real)." );
  }
  &lt;/script&gt;
  &lt;button class="5letter" onclick="doAlert5();" style="color:orange"&gt;Generate with 5 letters.&lt;/button&gt;
  &lt;script&gt;
  function createRandomWord5(length) {
      var consonants = 'bcdfghjklmnpqrstvwxyz',
          vowels = 'aeiou',
          rand = function(limit) {
              return Math.floor(Math.random()*limit);
          },
          i, word='', length = parseInt(length,10),
          consonants = consonants.split(''),
          vowels = vowels.split('');
      for (i=0;i&lt;length/2;i++) {
          var randConsonant = consonants[rand(consonants.length)],
              randVowel = vowels[rand(vowels.length)];
          word += (i===0) ? randConsonant.toUpperCase() : randConsonant;
          word += i*2&lt;length-1 ? randVowel : '';
      }
      return word;
  }
  function doAlert5() {
  alert( "Your word is: "+createRandomWord(5)+" (bonus points if your word is real)." );
  }
  &lt;/script&gt;
  &lt;button class="4letter" onclick="doAlert4();" style="color:orange"&gt;Generate with 4 letters.&lt;/button&gt;
  &lt;script&gt;
  function createRandomWord4(length) {
      var consonants = 'bcdfghjklmnpqrstvwxyz♀☺☻ƒ=ù"?',
          vowels = 'aeiou',
          rand = function(limit) {
              return Math.floor(Math.random()*limit);
          },
          i, word='', length = parseInt(length,10),
          consonants = consonants.split(''),
          vowels = vowels.split('');
      for (i=0;i&lt;length/2;i++) {
          var randConsonant = consonants[rand(consonants.length)],
              randVowel = vowels[rand(vowels.length)];
          word += (i===0) ? randConsonant.toUpperCase() : randConsonant;
          word += i*2&lt;length-1 ? randVowel : '';
      }
      return word;
  }
  function doAlert4() {
  alert( "Your word is: "+createRandomWord(4)+" (bonus points if your word is real)." );
  }
  &lt;/script&gt;
  &lt;button class="3letter" onclick="doAlert3();" style="color:orange"&gt;Generate with 3 letters.&lt;/button&gt;
  &lt;script&gt;
  function createRandomWord3(length) {
      var consonants = 'bcdfghjklmnpqrstvwxyz',
          vowels = 'aeiou',
          rand = function(limit) {
              return Math.floor(Math.random()*limit);
          },
          i, word='', length = parseInt(length,10),
          consonants = consonants.split(''),
          vowels = vowels.split('');
      for (i=0;i&lt;length/2;i++) {
          var randConsonant = consonants[rand(consonants.length)],
              randVowel = vowels[rand(vowels.length)];
          word += (i===0) ? randConsonant.toUpperCase() : randConsonant;
          word += i*2&lt;length-1 ? randVowel : '';
      }
      return word;
  }
  function doAlert3() {
  alert( "Your word is: "+createRandomWord(3)+" (bonus points if your word is real)." );
  }
  &lt;/script&gt;
  &lt;h1 style="color:grey"&gt;Name Generator:&lt;/h1&gt;
  &lt;button style="color:orange" onclick="generator();"&gt;Generate&lt;/button&gt;
  &lt;script&gt;
  function generator(){
    
    var first = ["Kick","Stupid","Random Name","Officer","School-Related","Unoriginal","Original","Mousey","Website to name things?","n00b","Error","var first=name.first","Bob","Joe","Boris","Duck","Cheese","Pablo","Stimuli","Last Test Grade","First Word","Puss","Cat","Cherokee", "Jerry", "[Insert Weird First Name Here]"]
    var last = ["Me","Idiot","dummy.dummy","randomwordgen.net16.net (shameless advertising)","he went that way","it was him!","DESTRUCTION...","Rats","You need advice for a name, use a website or something! Oh wait.","Opposition","Apple","404 not found","var last=name.last","You sure you want to pick this name?","McGuire","Rox","Knox","Bobert","Green","Raul","Damend","Milk","Positive","Negative","Rocky","Boots","Cherry","Parakeet","[Insert Weird Last Name Here]"]
  
    var randomNumber1 = parseInt(Math.random() * first.length);
    var randomNumber2 = parseInt(Math.random() * last.length);
    var name = first[randomNumber1] + " " + last[randomNumber2];
  
    alert(name);            
  
    
    }
    
  &lt;/script&gt;
  &lt;h1 style="color:grey"&gt;List Randomizer&lt;/h1&gt;
  &lt;div&gt;
  &lt;input type="text" id="Words"&gt;
  &lt;button id="Add" onClick="appendToArray()"&gt;Add To List&lt;/button&gt;
  &lt;script&gt;
  function appendToArray() {
  var Words = document.getElementById("Words");
  var Word = Words.value 
  var arr = [];
  arr.push(Word);
  }
  
  &lt;/script&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  
  And this is the code for the list part:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1 style="color:grey"&gt;List Randomizer&lt;/h1&gt;
  &lt;div&gt;
  &lt;input type="text" id="Words"&gt;
  &lt;button id="Add" onClick="appendToArray()"&gt;Add To List&lt;/button&gt;
  &lt;script&gt;
  function appendToArray() {
  var Words = document.getElementById("Words");
  var Word = Words.value 
  var arr = [];
  arr.push(Word);
  }
  
  &lt;/script&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Thanks in advance!</p>