Bootstrap 4 and Tabs

General question as I know this worked in Bootstrap 3, and seems to be broken or not implemented in Bootstrap 4. So the question is trhere a work around to have one set of nav controlling multiple tab panels. As I am wanting to do a break in the tab panels for a jumbotron and pick back up. However I want it all controlled by one set of nav.

Here is a jsfiddle example for Bootstrap 3 jsFiddle

I found the jsFiddle link here Stack Overflow

This is just a matter of where you put your content divs. When you say you want to do a “break” for a jumbotron, do you mean you want the jumbotron to be in between the tabs and the rest of the content, and stay persistent no matter which tab is selected?

Basically it would go

 <ul id="myTab" class="nav nav-tabs">
        <li class="active"><a href="#home" data-target="#home, #home_else" data-toggle="tab">C1</a></li>
        <li><a href="#profile" data-target="#profile, #profile_else" data-toggle="tab">C2</a></li>
    </ul>

<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade in active" id="home">
        <p>Content 1.</p>
    </div>
    <div class="tab-pane fade" id="profile">
        <p>Content 2.</p>
    </div>
</div>
<div class="jumbotron">
</div>
<hr>

<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade in active" id="home_else">
        <p>Content 111.</p>
    </div>
    <div class="tab-pane fade" id="profile_else">
        <p>Content 2222.</p>
    </div>

and so on, after the final break the content will load more of said panel via ajax script. However, I need the panels to all be controlled by one set of nav controls.

Just to be clear the jsfiddle i linked works with bootstrap 3, and would work for what I want. However, that would require me completely redoing all the work I have done so i am trying to find a work around for bootstrap 4.