Switching tabs only work once

Hello,
I’m doing a little bit of McGyvering and switching tabs from a dropdown. It works well, but only once (ie if I want to return to a tab that was previously active, nothing happens) - very similar to what is described here: https://github.com/twbs/bootstrap/issues/17371 .

This is my code for the dropdown menu and items:

<div class="dropdown ">
							<button id="dropdown_profile" class="btn btn-secondary dropdown-toggle btn-sm" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-user tx-center wd-16 mg-r-5"></i> MY PROFILE
								OPTIONS</button>
							<div class="dropdown-menu" aria-labelledby="dropdown1">
								<a class="dropdown-item" href="javascript:void(0);" class="nav-link-sec active" data-toggle="tab" data-target="#tabContent_profile_1">My details</a>
								<a class="dropdown-item" href="javascript:void(0);" class="nav-link-sec" data-toggle="tab" data-target="#tabContent_profile_2" ><i class="fa fa-circle tx-center wd-16 mg-r-5"></i>My RSA keys</a>
								
							</div>
						</div>

And this is an example of the tabs I’m trying to switch back and forth:

<div class="tab-content" id="tabContent_profile">
	<div class="tab-pane fade show active" id="tabContent_profile_1" role="tabpanel">
            <p>Data here</p>
         </div>
<div class="tab-pane fade" id="tabContent_profile_2" role="tabpanel">
 <p>More data here</p>
         </div>

I am not skilled enough to adapt the code from the workaround suggested in the page above to this use case, if it even applies. Has anybody ever met a similar situation and would anyone have a suggestion to remove the active class if this is the issue?
The app is using Bootstrap 4.

Thanks!