What is the best approach?

Question

JavaScript

There is data in json format. JS parses and creates elements on the page based on them.
For each object in json, there are several elements on the page and they are connected:
an element card, an element in the menu, a checkbox. label, icon.
When clicking on each, some action should take place with another related element (for example, when clicking on a checkbox, hide the card, and when clicking on a card, highlight the menu item).
Actually the question is which of these 2 ways to choose and what will be more optimal / correct:
1. Create an array in which to write objects for each element, for example:

var items = [];
...
var current_elem = {};
current_elem.menuDiv = createDiv();
current_elem.iconDiv = createDiv();
current_elem.cardDiv =  createDiv();
current_elem.checkboxDiv =  createDiv();
current_elem.labelDiv =  createDiv();
items.push(current_elem);
...

And in each element in the attribute ('data-element-id') store the ordinal number of the element in the array and access it already.
2. in each element in the attribute ('data-element-id') to store the ordinal number of the element, but every time you click on the object, calculate the dependent one through document.getElementById();
That is, you need to hide the card when you click on the checkbox - ok:

hide(document.getElementById('checkbox-for-' + this.getAttribute('data-element-id')));

Answer 1

You can do something like this: jsfiddle.net/lega911/gh3coxfy
If you want something like standalone widgets, then you can do it simpler