JQuery заменить внутренний div другим

Question

Я пытаюсь заменить вложенный div новым div.

html_string= "<div id='container'><div id='inner'></div></div>"; 

var newHtml = $(html_string).find("div#inner").replaceWith("<div>NEW CONTENT</div>").html(); 

console.log('new html is'); 
console.log(newHtml); 
console.log('html_string is'); 
console.log(html_string); 

Однако я получаю выход

new html is 

html_string is 
<div id='container'><div id='inner'></div></div> 

Оно не будет замещаться ...

Answer 1

Попробуйте

html_string= "<div id='container'><div id='inner'></div></div>"; 

var newHtml = $(html_string).find("div#inner").replaceWith("<div>NEW CONTENT</div>").end().get(0).outerHTML; 

console.log('new html is'); 
console.log(newHtml); 
console.log('html_string is'); 
console.log(html_string); 

Демо: Fiddle

Answer 2

сломать его вверх маленький:

html_string = "<div id='container'><div id='inner'></div></div>"; 
var newHtml = $(html_string) 
newHtml.find("div#inner").replaceWith("<div>NEW CONTENT</div>"); 

console.log('new html is:' + $(newHtml)[0].innerHTML); 
console.log('html_string is' + $(html_string)[0].innerHTML); 

Обратите внимание, что - html_string IS строка и остается неизменной. - newHtml является объектом jQuery и изменяется.

Выходы

> new html is:<div>NEW CONTENT</div> 
> html_string is<div> id="inner"></div>