title: Regex replace text outside html tags
body: <p>I have this HTML:</p>
  
  <pre><code>"This is simple html text &lt;span class='simple'&gt;simple simple text text&lt;/span&gt; text"
  </code></pre>
  
  <p>I need to match only words that are outside any HTML tag. I mean if I want to match “simple” and “text” I should get the results only from “This is simple html text” and the last part “text”—the result will be “simple” 1 match, “text” 2 matches. Could anyone help me with this? I’m using jQuery.</p>
  
  <pre><code>var pattern = new RegExp("(\\b" + value + "\\b)", 'gi');
  
  if (pattern.test(text)) {
      text = text.replace(pattern, "&lt;span class='notranslate'&gt;$1&lt;/span&gt;");
  }
  </code></pre>
  
  <ul>
  <li><code>value</code> is the word I want to match (in this case “simple”)</li>
  <li><code>text</code> is <code>"This is simple html text &lt;span class='simple'&gt;simple simple text text&lt;/span&gt; text"</code></li>
  </ul>
  
  <p>I need to wrap all selected words (in this example it is “simple”) with <code>&lt;span&gt;</code>. But I want to wrap only words that are outside <em>any</em> HTML tags. The result of this example should be</p>
  
  <pre><code>This is &lt;span class='notranslate'&gt;simple&lt;/span&gt; html &lt;span class='notranslate'&gt;text&lt;/span&gt; &lt;span class='simple'&gt;simple simple text text&lt;/span&gt; &lt;span class='notranslate'&gt;text&lt;/span&gt;
  </code></pre>
  
  <p>I do not want replace any text inside</p>
  
  <pre><code>&lt;span class='simple'&gt;simple simple text text&lt;/span&gt;
  </code></pre>
  
  <p>It should be the same as before replacement.</p>