title: Loop through text nodes inside a div
body: <p>I am trying to do a text replace, but to do so, i need to loop through the text nodes of a div.</p>
  
  <p>Each Div upon clicking, loads via ajax it's appropriate content. But then I need to do text-replacing inside any of the text nodes inside there.</p>
  
  <p>My current code, after loading the ajax content, loops through all text nodes of the whole page, and therefore is too resource intensive.</p>
  
  <p>I have been looking for hours trying to find out how to both loop thru a div, and get the text nodes...</p>
  
  <p>and this has to work in firefox, google chrome and ie6.</p>
  
  <p>Any thoughts or suggestions?</p>
  
  <p>As Requested, here is the code:</p>
  
  <pre><code>function ajaxLoader(url, id) {
      if (document.getElementById) {
          var x = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();
      }
      if (x) {
          x.onreadystatechange = function () {
              if (x.readyState == 4 &amp;&amp; x.status == 200) {
                  el = document.getElementById(id);
                  el.innerHTML = x.responseText;
              }
          }
          x.open("GET", url, true);
          x.send(null);
      }
      // alert(id);
      CheckTranslate(id);
      // setTimeout('CheckTranslate(this);', 1000);
  
  }
  
  function CheckTranslate(id) {
  
      // function to get text of a node
      var content = function (node, txt) {
          if (txt) {
              if (node.textContent) {
                  node.textContent = txt;
              } else if (node.nodeValue) {
                  node.nodeValue = txt;
              }
          } else {
              return node.textContent ? node.textContent : node.nodeValue;
          }
      };
      // recuse div by id content
      $("#"+id).each(function() {
          // assign object handler
          var obj = $(this).html();
  
          // check how many text nodes there
          var mylen = obj.length;
  
          if (mylen &gt; 0) {
              // loop thru each text node
          }
      });
      // recurse ajax content
      (function (parent) {
      var childs = parent.childNodes;
  
      // if there are children to this
      if (childs &amp;&amp; childs.length) {
  
          // loop through each text node
          for (var i = 0, node; node = childs[i]; i++) {
  
          // text node found, do the replacement          
          if (node.nodeType == 3) { 
  
              // grab value of current text node
              var value = content(node);
  
              // grab class name of current text node
              var myclass = $(this).attr("class");
  
              // grab data property of this node
              var ist = $(this).data('translated');
  
              // check if this is correct class and has no data property and value is not undefined
              if (typeof(value) != 'undefined' &amp;&amp; myclass != 'box_title' &amp;&amp; ist != 'yes' &amp;&amp; (myclass == 'status_bar' || myclass == '' || myclass == 'box_title_small' || myclass == 'status_bar_select')) {
  
                  // loop thru english array to find matches
                  for (var x = 0; x &lt; en_count; x++) {
  
                      // get current english phrase
                      var from = en_lang[x];
  
                      // get current other language phrase
                      var to = other_lang[x];
  
                      if (value.match(from)) {
  
                          content(node, value.replace(from, to));
                          if ($.browser.msie == 'false') {
                              $(node).data('translated', 'yes');
                          }
                      }
                      // end check value match
                  }
              }
          } else {
              arguments.callee(node);
          }
      }
      }
      })(document.body);
  }   
  </code></pre>
  
  <p>There are 2 functions, ajaxLoader, which loads the ajax content for divs, and then the CheckTranslate, which does translation after the new content is loaded.</p>
  
  <p>The problem being is the function(parent) section looks at all text nodes, where for performance, i'd rather only look at text nodes inside the div.</p>
  
  <p>But I just don't get how to refer to those...</p>
  
  <p>It is very hard to figure this kind of stuff out, and jquery's documentation is not really easy to learn...</p>