Error in jQuery UI Tabs: Mismatching fragment identifier.

First, I would see if the problem is that your two tabs have identical link in their href-attribute. Both have #changedTable, try having unique href for each tab.

Secondly, your tab setup looks unfamiliar to me. Maybe it's fine but I always have the content divs inside the tab div.

As:

<div id="tabs">
  <ul>
    <li><a href="#tab-1">Something</a></li>
    <li><a href="#tab-2">Something else</a></li>
  </ul>

  <div id="tab-1">
    <p>Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla.</p>
  </div>
  <div id="tab-2">
    <p>Curabitur ornare consequat nunc. Aenean vel metus.</p>
  </div>
</div>

The href of tab should have the # symbol and the id of the tab content can not have the #.

My case was the tab content where outside the tag, according to the official JQuery Example https://jqueryui.com/tabs/

<!-- error  -->

<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Nunc tincidunt</a></li>
    <li><a href="#tabs-2">Proin dolor</a></li>
    <li><a href="#tabs-3">Aenean lacinia</a></li>
  </ul>
</div>

  <div id="tabs-1">
    <p>abc.</p>
  </div>
  <div id="tabs-2">
    <p>def.</p>
  </div>
  <div id="tabs-3">
    <p>ghi.</p>
  </div>

<!-- correct -->
<div id="tabs">
  <ul>
    <li><a href="#tabs-1">Nunc tincidunt</a></li>
    <li><a href="#tabs-2">Proin dolor</a></li>
    <li><a href="#tabs-3">Aenean lacinia</a></li>
  </ul>
  <div id="tabs-1">
    <p>abc.</p>
  </div>
  <div id="tabs-2">
    <p>def.</p>
  </div>
  <div id="tabs-3">
    <p>ghi.</p>
  </div>
</div>