diff --git a/packages/mermaid/src/dagre-wrapper/createLabel.js b/packages/mermaid/src/dagre-wrapper/createLabel.js
index f49d65f25..d2b59b5a9 100644
--- a/packages/mermaid/src/dagre-wrapper/createLabel.js
+++ b/packages/mermaid/src/dagre-wrapper/createLabel.js
@@ -25,15 +25,10 @@ function addHtmlLabel(node) {
 
   const label = node.label;
   const labelClass = node.isNode ? 'nodeLabel' : 'edgeLabel';
-  div.html(
-    '<span class="' +
-      labelClass +
-      '" ' +
-      (node.labelStyle ? 'style="' + node.labelStyle + '"' : '') +
-      '>' +
-      label +
-      '</span>'
-  );
+  const span = div.append('span');
+  span.html(label);
+  applyStyle(span, node.labelStyle);
+  span.attr('class', labelClass);
 
   applyStyle(div, node.labelStyle);
   div.style('display', 'inline-block');
diff --git a/packages/mermaid/src/rendering-util/createText.ts b/packages/mermaid/src/rendering-util/createText.ts
index 0a7e3bbb0..18695c818 100644
--- a/packages/mermaid/src/rendering-util/createText.ts
+++ b/packages/mermaid/src/rendering-util/createText.ts
@@ -21,13 +21,10 @@ function addHtmlSpan(element, node, width, classes, addBackground = false) {
 
   const label = node.label;
   const labelClass = node.isNode ? 'nodeLabel' : 'edgeLabel';
-  div.html(
-    `<span class="${labelClass} ${classes}" ` +
-      (node.labelStyle ? 'style="' + node.labelStyle + '"' : '') +
-      '>' +
-      label +
-      '</span>'
-  );
+  const span = div.append('span');
+  span.html(label);
+  applyStyle(span, node.labelStyle);
+  span.attr('class', `${labelClass} ${classes}`);
 
   applyStyle(div, node.labelStyle);
   div.style('display', 'table-cell');