JSFiddle - React, Tailwind, and code Playground

HTML

<p>
  <highlight class="highlight" data-id="1464586442243" data-container="body" data-toggle="popover" data-placement="right" data-content="<p>first</p><button class=&quot;btn edit_annotation&quot; data-id=&quot;1464586442243&quot;>Edit</button>&amp;nbsp;<button class=&quot;btn delete_annotation&quot; data-id=&quot;1464586442243&quot;>Delete</button>"
  id="anchor_1464586442243" data-original-title="" title="">Section</highlight> 1
  <highlight class="highlight" data-id="1464586450092" data-container="body" data-toggle="popover" data-placement="right" data-content="<p>second</p><button class=&quot;btn edit_annotation&quot; data-id=&quot;1464586450092&quot;>Edit</button>&amp;nbsp;<button class=&quot;btn delete_annotation&quot; data-id=&quot;1464586450092&quot;>Delete</button>"
  id="anchor_1464586450092" data-original-title="" title="">removable</highlight> true</p>
<button id="remove" type="button">Remove</button>

CSS

/*
================
Expected result:
================

<p>
  <highlight class="highlight" data-id="1464586442243" data-container="body" data-toggle="popover" data-placement="right" data-content="<p>first</p><button class=&quot;btn edit_annotation&quot; data-id=&quot;1464586442243&quot;>Edit</button>&amp;nbsp;<button class=&quot;btn delete_annotation&quot; data-id=&quot;1464586442243&quot;>Delete</button>" id="anchor_1464586442243" data-original-title="" title="">Section</highlight> 1 removable true
</p>

*/

JavaScript

$(function() {
  $('#remove').click(function() {
    $('highlight:contains("removable")').each(function() {
      $(this).before( $(this).html() ).remove();
      // i stuck here
    })
  });
});