I have the following HTML rendered out in powerapps portal and I would like to replace all the occurrence of
<font size = 3>..... </font>
with
<div class="legend">... </div>
I have tried the snippet below, but it didn't replace it:
var $descBox = $("<font size = 3>"); $descBox.replaceAll("<div class='legend well'>");
$().$()..replaceAll() is a string function. You meant .replaceWith().i.e.
$("font[size=3]").replaceWith( $("<div class='legend well'>") );
or, shorter
$("font[size=3]").replaceWith("<div class='legend well'>");
Exchanging only the <font> elements without also replacing their contents requires a couple more steps.
$("font[size=3]").each(function () {
// insert new container div after each `<font>`
var $div = $("<div class='legend well'>").insertAfter(this);
// remove the `<font>` and append its children to the new container
$(this).remove().children().appendTo($div);
});div.legend {
color: blue;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<font size="3">
<p>elements to keep</p>
</font>
<font size="3">
<p>more elements to keep</p>
</font>