Add CSS to react created elements like data-reactroot
<p>Under my root div react creates another div "automatically". Is there a way to add a class to that div? I need to add height: 100% to it to prevent the background content to scroll in mobile when an overlay is shown. </p>

<p>This is how it is shown when i inspect the element on the site. I need to add height:100% to the data-reactroot div when a button is clicked. But that div is nowhere in my source code.</p>

<pre><code>&lt;div id="root"&gt;
    &lt;div data-reactroot data-reactid="1" data-react-checksum="161698...
</code></pre>

<p>I could add this code in the container's componentDidMount()</p>

<pre><code>    let root = document.querySelectorAll('[data-reactroot]')[0];
    if (root) {
        root.style.height = '100%';
    }
</code></pre>

<p>But isnt there a better way to do it? This feels like kind of hacky (in a bad way)</p>