Вставьте React "root" dom, чтобы он был на странице программно

Допустим, в моем HTML-файле есть:

<div id = "root"></div>

Чтобы отобразить элемент React в этом узле DOM, я передаю его в ReactDOM.render ():

const element = <h1>Hello, world</h1>;
ReactDOM.render(element, document.getElementById('root'));

Но что, если этот узел создается программно, после того, как, скажем, пользователь входит в систему, поэтому его рендеринг задерживается. Для иллюстрации я пытаюсь сделать что-то вроде:

<script type = "text/javascript">
        setTimeout(function(){
            document.body.innerHTML += '<div id = "root" data-user = "1"></div>'
        }, 3000)
    </script> 

Это не работает. ReactDOM ничего не находит на первом проходе, когда ищет document.getElementById('root'), и поэтому ничего не отображает. Есть ли способ сделать это динамически?