JSFiddle - React, Tailwind, and code Playground

CSS

div {
    background: red;
    color: #fff;
}

JavaScript

var keywords = [ 'Foo', 'Bar'];

var str = "<p>Foo</p>\r\n\
  <p>Lorem ipsum dolor sit amet</p>\r\n\
  <p>Lorem <b>ipsum</b> dolor sit amet</p>\r\n\
  <p>Lorem ipsum dolor sit amet</p>\r\n\
  <p>Bar</p>\r\n\
  <p>Lorem ipsum dolor sit amet</p>";

var keywordsRegEx = keywords.map(function(x){return x.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');}).join('|');
var result = str.replace(new RegExp('<p>(' + keywordsRegEx + ')</p>\r\n((?:[ \t]*<p>(?:(?!' + keywordsRegEx + ').)*</p>(?:\r\n)?)*)', 'mgi'), '<div><h1 class="$1">$1</h1>\r\n$2</div>\r\n');

document.body.innerHTML = result;