JAVASCRIPT: Replace a single character into a <p> - dom

Question

I've got a word in an HTML paragraph. For example 'string':
<p id="myWord">string</p>
I want to change only a character of that word. For example 'strong':
So I add an html button that calls a function:
<button onclick="myFunction">replace 'i'</button>
the function in JS is this but it can't access to the fourth character of myWord:
function myFunction{
document.getElementById("myWord[3]").innerHTML = 'o';
}
Here is the unWorking fiddle: https://jsfiddle.net/su3Lrezr/4/
How can I access to a index of a word in a html paragraph? I already tried to convert myWord into an array with split() method but it doesn't work.
Thanks everybody

Answer 1

Array method:
You'll want to split the string at value 'i' Then rejoin them together with an 'o' in the middle. Then update your innerHTML. You will need the split() function. This will work:
function myFunction(){
var word = document.getElementById('myWord').innerHTML;
var result = word.split('i');
var newword = result[0] + "o" + result[1];
document.getElementById('myWord').innerHTML = newword;
}
Also, as a commenter has mentioned your syntax for calling functions is wrong. You must call functions like this: myFunction() and declare them like this: function myFunction(){ }