I have the following HTML structure:
<div id="container">
<b>Hello</b>
World
</div>
and I’d like to replace World
with Earth
like this:
<div id="container">
<b>Hello</b>
Earth
</div>
I don’t want to modify the <b>Hello</b>
element at all.
I can grab the container like this:
var el = document.querySelector("#container")
which has three element in childNodes
, the last of which is a textNode
:
Is there a way to replace the text in the last element without modifying the entire innerHTML
or innerText
?
var el = document.querySelector("#container")
console.log(el.childNodes)
<div id="container">
<b>Hello</b>
World
</div>