jQuery를 사용하여 HTML 문자열 변경 : 문자열 업데이트 안함

Question

2 개의 HTML 문자열을 사용하는 JQuery가 있습니다. 각 문자열은 한 문자열에서 각 요소의 내용이 다른 내용을 제외하고 정확히 동일한 html을 포함합니다.이 문자열은 newContent이고 다른 하나는 oldContent입니다.

내 기능 : oldContent 이상 반복 클래스 (oldContent 내부) "갱신"우리가 newContent에서 동일한 요소의 innerText와 자사의 innerText와 변경의 각 요소에 대해.

내 문제

:은 내가 기능을 수행 한 후 (무엇을 어떻게해야하는 업데이트 가능한 클래스의 요소가 다른 innerText와이 있어야한다는 것입니다 경우), oldContent은 동일한 HTML을 포함, oldContent의 내용을 변경하지 않습니다.

왜 oldContent 문자열이 변경되지 않습니까?

function insertContentIntoUpdatableElements(oldContent, newContent) 
{ 
    // Pre: oldContent & newContent must be strings of HTML returned from jquery's 
    //  $("").html() 

    try 
    { 
     alert("BEFORE: "+oldContent); 
     var index  = 0; 
     var oldElements = $(oldContent).find(".updatable"); 
     var newElements = $(newContent).find(".updatable"); 

     $(oldContent).find(".updatable").each(function() 
     { 
      var txt = $(newElements[index]).text(); alert("TEXT: "+txt); 
      alert("OLD TEXT: "+$(this).text()); 
      $(this).text(txt); 
      index++; 

      alert("NEW TEXT: "+$(this).text()); // prints out CORRECT updated/changed text 
     }); 

     alert("AFTER: "+oldContent); // prints out INCORRECT updated/changed text for each element of class "updatable" 
     return oldContent; 
    } 
    catch(ex) { alert("In insertContentIntoUpdatableElements(): "+ex); return "FAILED"; } 
} 

Answer 1

이 트릭을 수행해야합니다.

function insertContentIntoUpdatableElements(oldContent, newContent) 
    { 
    var result = $(oldContent); 
    var oldElements = result.find(".updatable"); 
    var newElements = $(newContent).find(".updatable"); 

    $(oldElements).each(function(index, el) 
    { 
     $(oldElements[index]).text($(newElements[index]).text()); 
    }); 
    return result; 
    } 

는 jsFiddle에서 작동하는 데모를 참조하십시오 작동 http://jsfiddle.net/ZZVgh/