JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<style type="text/css">
    #accordion h3 {
        background-color: grey;
        padding: 4px;
    }
    #additionalContent {
        display: none;
    }
</style>
<div id="accordion">
    
<h3>Section 1</h3>

    <div id="accordion1">
        <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut</p>
    </div>
    
<h3>Section 2</h3>

    <div id="accordion2">
        <p>. . . . . . more . . . . also i tried the Patrick's steps below but it never worked for me,</p>
    </div>
</div>
<div id="additionalContent">Today’s awesome collection of design freebies brings you a veritable utopia of navigation menu bliss. Each of the fifteen navigation menus below are both completely gorgeous 100% free to download. I’ve included both CSS and PSD menus so whether you’re just looking to create a mockup or need something fully functional, we’ve got you covered. Enjoy!</div>

JavaScript

$(function () {
    var additionalContent = $('#additionalContent').html();
    $('#accordion2').append(additionalContent);
    $("#accordion").accordion();
});