title: jQuery Loop through text content while keeping wrapping html tags
body: <p>I have the following javascript function that aims to append a BIDI code to text that matches a specific criteria.The problem with the current function is that it works great with text only content but is problematic with content that has HTML Content. To summarize, I am splitting the text into words and checking if any of the characters in each word is matching a certain criteria to append the BIDI code to it.</p>
  
  <p>The current status:</p>
  
  <pre><code>&lt;div&gt;This is the text that I am processing&lt;/div&gt; //This works great
  
  &lt;div&gt;&lt;span&gt;This is the text&lt;/span&gt;&lt;p&gt;that I am processing&lt;/p&gt;&lt;/div&gt; // This doesn't work well.
  </code></pre>
  
  <p>I want the function to work is for the text but also to keep the wrapping HTML tags in their place in order to keep <p></p> etc....</p>
  
  <pre><code>function flipper(flipselector) {
          var pagetitle = $(flipselector);
          var text = pagetitle.text().split(' '); //I know that I am using text function here but .html didn't work either
          var newtext="";
      for( var i = 1, len = text.length; i &lt; len; i=i+1 ) {
          //text[i] = '&lt;span&gt;' + text[i] + '&lt;/span&gt;';
          newstring="";
  
          if (matches = text[i].match(/\d/))
          {
              var currentstring=text[i];
              for (var x = 0, charlen = currentstring.length; x &lt; charlen; x++) {
  
                  if (matches = currentstring[x].match(/\d/)) {
                      varnewchar=currentstring[x];
                  }else {
                      varnewchar= "&amp;rlm;" + currentstring[x];    
                  }
  
                  newstring=newstring + varnewchar;
              }
  
          } else {
              newstring= text[i];
          }
  
            newtext=newtext + " " + newstring;
      }
      pagetitle.html(newtext);
      }
  </code></pre>