Замените слова узла js var на список диапазонов html внутри div

Я хочу поменять местами слова в js, я хочу, чтобы слова брались из списка слов внутри div, источником этого проекта является файл codepen, вот ссылка на файл codepen https://codepen .io/controversial/pen/wWVGOv Я не уверен, разрешено ли редактирование этого файла codepen или нет, но это то, что мне нужно научиться делать, заранее спасибо.

   <div id = "bubbles"></div>

    #bubbles {
  position: absolute;
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
}

    var nodes = new vis.DataSet([
  {label: "Pop"},
  {label: "Alternative"},
  {label: "Rock"},
  {label: "Jazz"},
  {label: "Hits"},
  {label: "Dance"},
  {label: "Metal"},
  {label: "Experimental"},
  {label: "Rap"},
  {label: "Electronic"},
]);
var edges = new vis.DataSet();

var container = document.getElementById('bubbles');
var data = {
  nodes: nodes,
  edges: edges
};

var options = {
  nodes: {borderWidth:0,shape:"circle",color:{background:'#F92C55', highlight:{background:'#F92C55', border: '#F92C55'}},font:{color:'#fff'}},
  physics: {
    stabilization: false,
    minVelocity:  0.01,
    solver: "repulsion",
    repulsion: {
      nodeDistance: 40
    }
  }
};
var network = new vis.Network(container, data, options);


// Events
network.on("click", function(e) {
  if (e.nodes.length) {
    var node = nodes.get(e.nodes[0]);
    // Do something
    nodes.update(node);
  }
});

Пробую использовать Google's Bard и он завис и не смог сделать, попробовал от недоумения и тоже не смог.