---
title: "How do I update html element in a string inside an object?"  
description: "How do I update html element in a string inside an object?"  
author: "Royce Roy"  
published: 2013-05-11  
updated: 2013-05-11  
canonical: https://www.mindstick.com/forum/867/how-do-i-update-html-element-in-a-string-inside-an-object  
category: "javascript"  
tags: ["javascript"]  
reading_time: 2 minutes  

---

# How do I update html element in a string inside an object?

Hi All!\
I'm having a hard time [doing something](https://www.mindstick.com/forum/33390/nsdateformatter-am-i-doing-something-wrong-or-is-this-a-bug) that seems really simple. I have a [javascript](https://www.mindstick.com/articles/874/how-to-create-watermark-text-for-textbox-by-using-javascript) object:\
var main = { pages : { "123" : { "[content](https://www.mindstick.com/articles/13019/get-the-best-content-marketing-pricing-packages-for-your-brand)": "<div><p>The div</p></div><nav><p>The nav</p></nav>", "foo":"bar" }, "456" : { "content": "<div><p>The div</p></div><nav><p>The nav</p></nav>", "foo":"bar" } }};I'm trying the following code:\
$([function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server)(){ var p = main.pages; $.each(p,function(i,el){ var c = p[i].content; var newc = $(c).find('nav').html('<p>New content</p>'); //console.log(c); //console.log(newc); }); //console.log(p)});\
To make my object look like:\
var main = { pages : { "123" : { "content": "<div><p>The div</p></div><nav><p>New content</p></nav>", "foo":"bar" }, "456" : { "content": "<div><p>The div</p></div><nav><p>New content</p></nav>", "foo":"bar" } }};\
But I'm having a hard time doing it. What am I [missing](https://answers.mindstick.com/qa/52138/international-missing-children-s-day-2019-was-observed-on)?\
I have set up the former example in jsfiddle\
I do understand that it's generally not a good idea trying to manipulate [strings](https://www.mindstick.com/forum/161912/explain-the-python-strings) as dom [elements](https://www.mindstick.com/forum/1440/wpf-button-with-multiple-text-elements) but I have no other [choice](https://yourviews.mindstick.com/view/80821/it-s-not-easy-to-make-a-right-choice) since the object comes from a RESTful \
[server](https://www.mindstick.com/articles/43769/what-is-serverless-architecture-is-it-worth-switching-over) and it doesn't make much sense to inject the html in the current page for that.\
Thanks in [advance](https://www.mindstick.com/blog/33258/jee-mains-and-jee-advance-exams)! \

## Replies

### Reply by AVADHESH PATEL

Hi Royce!\
try as following. I hope it is helpful to you\
$(function () { var p = main.pages; //a temporary div var div = $('<div>'); $.each(p, function (i, el) { //append to div, find and replace the HTML div.append(p[i].content).find('nav').html('<p>New content</p>'); //turn back into a string and store p[i].content = div.html(); //empty the div for the next operation div.empty(); }); console.log(p);});\


---

Original Source: https://www.mindstick.com/forum/867/how-do-i-update-html-element-in-a-string-inside-an-object

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.