Attach element to a random place in HTML DOM tree

The idea is to create and insert div (whatever) to DOM. However, it needs to be done following 3 main rules:

• Each time div is created, it is placed randomly in document, scope may be - inside of body tag.
• Div should be accessible by JS for further usage.
• Div is hidden(by style or html 5 attribute). Ideally, not visible even from Elements tab in developer tools.

Additional info: front-end is built via React JS.

What are the basic mechanism of implementation of this task. Maybe we could benefit from using React Portals or even Shadow Dom (for encapsulation).