JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<div class="hint">
    <h1>Steps to reproduce failure</h1>
    
    <ol>
        <li>Click on section 2 -> section 1 stays open</li>
        <li>Click on section 1 -> the accordion works (now)</h1>
    </ol>
</div>
    <hr>
<div id="container" style="display:none">
    <div id="acc">
         <h2>Section 1</h2>

        <div>Content of section 1</div>
         <h2>Section 2</h2>

        <div>Content of section 2</div>
    </div>
</div>
<div id="clone"></div>

CSS

.hint {
    background:#eee;
    padding:.5em;
}

JavaScript

$('#acc').accordion();

$('#container')
    .clone(true)
    .show()
    .appendTo($('#clone'));