JSFiddle - React, Tailwind, and code Playground

HTML

<div>
        <span onclick="showSubjectContentInContainer('subjectContent')">Subject description</span>
        
        <div id="subjectContent">
                <div >
                    <div>
                        [CONTENT]
                    </div>
                    <div class="showSubContent"  onclick="showSubContent('subContentC')">Click here to show Sub Content</div>
                    <div id="subContent" class="subContentC">
                        [SUB-CONTENT]
                    </div>
                </div>
        </div>
    </div>
    <div id="container432"></div>

CSS

span
{
    cursor:pointer;
}
.showSubContent
{
    cursor:pointer;
}
.subContentC {
    display:none;
}
#subjectContent {
    display:none;
}

JavaScript

function showSubjectContentInContainer(subjectContentId)
{
    //get inner html of the subjectContent and place it in the Container div
    var htmlSubjectContent = $("#" + subjectContentId).html();
    $('#container432').html(htmlSubjectContent); 
}

function showSubContent(subContentId)
{
    //show the subContent which is added dynamically
    $("."+subContentId).show();
}