Events inside Jquery Modal not working when call modal('show') method

[vikingcodes]

I am using the following approach

import $ from 'jquery';
import 'jquery-modal';

When opening jquery-modal using data target , methods inside modal working fine.

<p data-toggle="modal" data-target="#my-profile">My Profile</p>

But when opening jquery-modal using modal method.

($('#my-profile') as any).modal('show');

Events inside modal not working.

Following is modal code

<div id="my-profile" className="modal" > <div className="" style={{ paddingTop: 120, paddingLeft: 450, paddingRight: 450 }}> <h1 className="modal-title">My <span className="txtBold">Address</span></h1> <div className="modal-bg-white pt4 pb4"> <div className="modal-tab"> <button className="tab active" onClick={(e) => { openTab(e, 'Info') }}>Info Details</button> <button className = "tab" onClick={(e) => {openTab(e, 'Address')}}>Address</button> </div> <div id="Info" className="tab-content" > Info </div> <div id="Address" className="tab-content" > Address </div> </div> </div> </div>