title: regex replace html tag with all attributes inside on special character
body: <p>My regex skills aren't so high so I apologize in advance if my question will bother somebody.</p>
  
  <p>I'm trying to convert string in two ways </p>
  
  <ol>
  <li>From special character => html tag with attributes</li>
  <li>Form html tag with attributes => special character</li>
  </ol>
  
  <p>the first way works fine and looks next: </p>
  
  <pre><code>var string = "User template user info: {{userFirstname}} - {{userLastname}}";
  var text = string
              .replace(/\{{/g, "&lt;span class='label label-danger' contenteditable='false' style='padding: 6px; color: #FFFFFF; font-size: 16px;'&gt;")
              .replace(/\}}/g, "&lt;span contenteditable='false' class='remove-tag fa fa-times'&gt;&lt;/span&gt;&lt;/span&gt;&amp;nbsp;");
  </code></pre>
  
  <p>the second way doesn't work and I can't understand the reason: </p>
  
  <pre><code>var text = 'User template user info: &lt;span class="label label-danger" contenteditable="false" style="padding: 6px; color: #FFFFFF; font-size: 16px;"&gt;userFirstname&lt;span contenteditable="false" class="remove-tag fa fa-times"&gt;&lt;/span&gt;&lt;/span&gt;&amp;nbsp; - &lt;span class="label label-danger" contenteditable="false" style="padding: 6px; color: #FFFFFF; font-size: 16px;"&gt;userLastname&lt;span contenteditable="false" class="remove-tag fa fa-times"&gt;&lt;/span&gt;&lt;/span&gt;&amp;nbsp;
  var string = text
              .replace(/&lt;span class='label label-danger' contenteditable='false' style='padding: 6px; color: #FFFFFF; font-size: 16px;'&gt;/g, "{{")
              .replace(/&lt;span contenteditable='false' class='remove-tag fa fa-times'&gt;&lt;\/span&gt;&lt;\/span&gt;&amp;nbsp;/g, "}}")
  </code></pre>
  
  <p>I appreciate if anybody could tell me what I'm missing. Thanks in advance </p>