How do I choose a random textContent?

I am trying to make a simple generator with Javascript just for fun. It's an outfit generator with different combinations of clothing.

Right now I have two buttons for two types of outfits (I would like to add more in the future). I want to instead have one button, and it will choose an outfit type (#falloutfita or #falloutfitb) and then generate the random outfit based on that.

I thought maybe I could use an "or" || with the textContent but it looks like it's not possible.

Here is my Javascript code up through the first outfit type:

var allsweaters = ["blue hoodie", "black hoodie", "pink v-neck sweater", "gray pullover"];
var allpants = ["black casual pants", "dark old navy jeans", "medium old navy jeans", "black jumpsuit"];
var alllongshirts = ["long-sleeved white shirt", "long-sleeved gray shirt", "long-sleeved black shirt"];
var allovershirts = ["white button-up", "green jacket", "blue jean shirt"];

document.querySelector("#submitfalla").addEventListener("click", () => {
  var sweater = "";
  var pants = "";
  var lsshirt = "";
  var random_index = 0;
  for (let i = 0; i < 1; i++) {
    random_index = Math.floor(Math.random() * allsweaters.length);
    sweater += allsweaters[random_index];
    random_index = Math.floor(Math.random() * allpants.length);
    pants += allpants[random_index];
    random_index = Math.floor(Math.random() * allpants.length);
    lsshirt += alllongshirts[random_index];
  }

  document.querySelector("#falloutfita").textContent = sweater + " and " + lsshirt + " and " + pants;
});

<button id="submitfalla">Submit</button>

<div id="falloutfita"></div>

It's my first post on stack overflow, please let me know if there is any way I should edit this question too! I've looked at similar questions here but haven't been able to successfully apply them to mine.