The text typed in is successfully converted by marked library, but it keeps the text style when it's rendered into the component. Why's that?

[luorobbin7]

const defaultText=`# Welcome to my React Markdown Previewer!

## This is a sub-heading...
### And here's some other cool stuff:

Heres some code, \`<div></div>\`, between 2 backticks.

\`\`\`
// this is multi-line code:

function anotherExample(firstLine, lastLine) {
  if (firstLine == '\`\`\`' && lastLine == '\`\`\`') {
    return multiLineCode;
  }
}
\`\`\`

You can also make text **bold**... whoa!
Or _italic_.
Or... wait for it... **_both!_**
And feel free to go crazy ~~crossing stuff out~~.

There's also [links](https://www.freecodecamp.org), and
> Block Quotes!

And if you want to get really crazy, even tables:

Wild Header | Crazy Header | Another Header?
------------ | ------------- | -------------
Your content can | be here, and it | can be here....
And here. | Okay. | I think we get it.

- And of course there are lists.
  - Some are bulleted.
     - With different indentation levels.
        - That look like this.


1. And there are numbered lists too.
1. Use just 1s if you want!
1. And last but not least, let's not forget embedded images:

![freeCodeCamp Logo](https://cdn.freecodecamp.org/testable-projects-fcc/images/fcc_secondary.svg)`
const markedText=marked.parse(defaultText);

class App extends React.Component{
  constructor(props){
    super(props)
  }
  
  state={text: defaultText}
  
  handleChange=(event)=>{
    const preview=document.querySelector('#preview');
    const inputText=event.target.value;
    this.setState({text:inputText});
    console.log(marked.parse(inputText));
    preview.innerHTML=marked.parse(inputText);
  }
  render(){
    return (
      <div id='wrapper'>
        <div id='editorWrapper'>
          <div id='editorHead'>
            <div id='editorHeadLeft'>
              <div><svg t="1659009394353" class="icon" viewBox="0 0 1316 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2794" width="32" height="32"><path d="M258.852571 935.424c0 16.018286-14.299429 30.866286-30.281142 30.866286-2.304 0-5.156571-1.133714-7.424-1.718857-32-7.424-73.142857-55.442286-92.562286-80.018286C39.424 771.986286 0 640.548571 0 498.249143 0 365.677714 40.009143 251.977143 121.709714 147.382857c18.870857-24.576 74.861714-89.161143 107.995429-89.161143 14.299429 0 29.147429 11.446857 29.147428 26.294857 0 17.152-25.161143 40.557714-35.986285 51.419429-31.414857 32.585143-60.562286 65.718857-84.004572 105.142857-48.566857 81.152-67.986286 162.304-67.986285 256.585143 0 101.156571 18.870857 192.585143 70.290285 280.576 21.723429 37.156571 47.433143 67.986286 77.714286 98.852571 11.995429 13.129143 40.009143 38.838857 40.009143 58.294858z m767.451429-76.580571c0 21.138286-14.299429 38.838857-36.571429 38.838857H372.004571c-20.004571 0-36.571429-16.566857-36.571428-36.571429 0-21.138286 14.299429-38.838857 36.571428-38.838857h617.728c20.004571 0 36.571429 16.566857 36.571429 36.571429z m-122.88-349.147429c0 47.981714-10.861714 92.562286-38.290286 133.156571-18.870857 28.013714-57.161143 64-87.442285 79.433143-4.571429 2.852571-10.276571 5.705143-15.433143 5.705143-4.571429 0-13.129143-5.156571-13.129143-10.276571 0-16.566857 69.705143-55.990857 69.705143-132.571429 0-25.161143-6.290286-53.138286-20.004572-74.276571-3.986286-5.705143-18.285714-23.990857-26.294857-23.990857-1.718857 0-1.718857 1.133714-1.718857 2.852571 0 13.714286 8.557714 26.843429 8.557714 41.142857 0 18.285714-22.272 27.428571-37.705143 27.428572-26.843429 0-37.705143-18.870857-37.705142-43.446858 0-16.566857 1.718857-33.718857 1.718857-50.285714 0-11.995429-0.585143-15.433143-5.705143-26.294857-8.009143-15.433143-34.304-46.848-53.138286-46.848-5.156571 0-6.838857 0-6.838857 5.156571 0 8.009143 18.285714 16.566857 18.285714 45.714286 0 75.995429-104.557714 89.709714-104.557714 165.705143 0 34.304 4.571429 62.866286 23.990857 91.428571 11.995429 17.700571 25.161143 28.013714 45.129143 35.986286 5.156571 1.718857 10.276571 2.304 10.276571 8.557714s-5.156571 9.142857-10.276571 9.142858c-2.852571 0-16.018286-5.156571-18.870857-6.290286-87.990857-32-154.843429-108.580571-154.843429-204.580572 0-113.700571 136.557714-213.138286 136.557715-322.304 0-21.138286-3.437714-35.986286-14.299429-53.723428-6.290286-10.276571-21.723429-30.281143-32-36.571429-4.571429-2.304-10.861714-6.290286-10.861714-11.995428 0-9.728 16.566857-11.446857 23.442285-11.446857 20.553143 0 43.995429 7.424 62.866286 16.566857 79.433143 37.705143 96 95.414857 109.714286 175.433143 3.437714 18.870857 10.276571 78.848 37.705143 78.848 17.700571 0 29.147429-11.995429 29.147428-29.147429 0-25.709714-22.857143-53.723429-22.857143-67.986286 0-3.986286 2.304-5.705143 5.705143-5.705143 14.299429 0 43.995429 30.281143 53.138286 40.009143 55.442286 58.843429 75.995429 116.004571 75.995429 195.437715zM1316.571429 526.299429c0 100.571429-26.843429 201.142857-78.848 287.414857-23.990857 40.009143-102.838857 151.990857-154.843429 151.990857-11.995429 0-26.294857-14.848-26.294857-26.843429 0-19.419429 66.852571-81.700571 83.419428-102.838857 70.838857-89.161143 104.557714-189.696 104.557715-303.433143 0-93.696-11.446857-169.728-53.138286-254.866285-25.709714-52.553143-52.553143-87.990857-93.147429-130.304-13.129143-13.714286-41.728-39.424-41.728-60.013715 0-14.299429 14.848-29.696 29.147429-29.696 37.705143 0 92.013714 69.705143 112.018286 96.585143 76.580571 102.838857 109.129143 208.566857 117.723428 335.433143 0.585143 11.995429 1.133714 24.576 1.133715 36.571429z" fill="" p-id="2795"></path></svg></div>
              <div>Editor</div>
            </div>
            <div id='editorHeadRight'><svg t="1659009144974" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2260" width="24" height="24"><path d="M216.64 747.093333l178.133333-178.176 60.373334 60.352-178.176 178.133334zM629.333333 455.04l178.133334-178.773333-60.373334-60.16-178.133333 178.56 60.373333 60.373333z" fill="#000" p-id="2261"></path><path d="M128 640v256h256L128 640zM896 384V128H640l256 256zM216.618667 276.949333l60.330666-60.330666 178.133334 178.133333-60.309334 60.373333zM568.96 629.333333l178.773333 178.133334 60.373334-60.373334-178.773334-178.133333-60.373333 60.373333z" fill="#000" p-id="2262"></path><path d="M384 128H128v256L384 128zM640 896h256V640L640 896z" fill="#000" p-id="2263"></path></svg></div>
          </div>
          <textarea id='editor' value={this.state.text} onChange={this.handleChange}>
            
          </textarea>
        </div>
        
        <div id='previewWrapper'>
          <div id='previewHead'>
            <div id='previewHeadLeft'>
              <div><svg t="1659009394353" class="icon" viewBox="0 0 1316 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2794" width="32" height="32"><path d="M258.852571 935.424c0 16.018286-14.299429 30.866286-30.281142 30.866286-2.304 0-5.156571-1.133714-7.424-1.718857-32-7.424-73.142857-55.442286-92.562286-80.018286C39.424 771.986286 0 640.548571 0 498.249143 0 365.677714 40.009143 251.977143 121.709714 147.382857c18.870857-24.576 74.861714-89.161143 107.995429-89.161143 14.299429 0 29.147429 11.446857 29.147428 26.294857 0 17.152-25.161143 40.557714-35.986285 51.419429-31.414857 32.585143-60.562286 65.718857-84.004572 105.142857-48.566857 81.152-67.986286 162.304-67.986285 256.585143 0 101.156571 18.870857 192.585143 70.290285 280.576 21.723429 37.156571 47.433143 67.986286 77.714286 98.852571 11.995429 13.129143 40.009143 38.838857 40.009143 58.294858z m767.451429-76.580571c0 21.138286-14.299429 38.838857-36.571429 38.838857H372.004571c-20.004571 0-36.571429-16.566857-36.571428-36.571429 0-21.138286 14.299429-38.838857 36.571428-38.838857h617.728c20.004571 0 36.571429 16.566857 36.571429 36.571429z m-122.88-349.147429c0 47.981714-10.861714 92.562286-38.290286 133.156571-18.870857 28.013714-57.161143 64-87.442285 79.433143-4.571429 2.852571-10.276571 5.705143-15.433143 5.705143-4.571429 0-13.129143-5.156571-13.129143-10.276571 0-16.566857 69.705143-55.990857 69.705143-132.571429 0-25.161143-6.290286-53.138286-20.004572-74.276571-3.986286-5.705143-18.285714-23.990857-26.294857-23.990857-1.718857 0-1.718857 1.133714-1.718857 2.852571 0 13.714286 8.557714 26.843429 8.557714 41.142857 0 18.285714-22.272 27.428571-37.705143 27.428572-26.843429 0-37.705143-18.870857-37.705142-43.446858 0-16.566857 1.718857-33.718857 1.718857-50.285714 0-11.995429-0.585143-15.433143-5.705143-26.294857-8.009143-15.433143-34.304-46.848-53.138286-46.848-5.156571 0-6.838857 0-6.838857 5.156571 0 8.009143 18.285714 16.566857 18.285714 45.714286 0 75.995429-104.557714 89.709714-104.557714 165.705143 0 34.304 4.571429 62.866286 23.990857 91.428571 11.995429 17.700571 25.161143 28.013714 45.129143 35.986286 5.156571 1.718857 10.276571 2.304 10.276571 8.557714s-5.156571 9.142857-10.276571 9.142858c-2.852571 0-16.018286-5.156571-18.870857-6.290286-87.990857-32-154.843429-108.580571-154.843429-204.580572 0-113.700571 136.557714-213.138286 136.557715-322.304 0-21.138286-3.437714-35.986286-14.299429-53.723428-6.290286-10.276571-21.723429-30.281143-32-36.571429-4.571429-2.304-10.861714-6.290286-10.861714-11.995428 0-9.728 16.566857-11.446857 23.442285-11.446857 20.553143 0 43.995429 7.424 62.866286 16.566857 79.433143 37.705143 96 95.414857 109.714286 175.433143 3.437714 18.870857 10.276571 78.848 37.705143 78.848 17.700571 0 29.147429-11.995429 29.147428-29.147429 0-25.709714-22.857143-53.723429-22.857143-67.986286 0-3.986286 2.304-5.705143 5.705143-5.705143 14.299429 0 43.995429 30.281143 53.138286 40.009143 55.442286 58.843429 75.995429 116.004571 75.995429 195.437715zM1316.571429 526.299429c0 100.571429-26.843429 201.142857-78.848 287.414857-23.990857 40.009143-102.838857 151.990857-154.843429 151.990857-11.995429 0-26.294857-14.848-26.294857-26.843429 0-19.419429 66.852571-81.700571 83.419428-102.838857 70.838857-89.161143 104.557714-189.696 104.557715-303.433143 0-93.696-11.446857-169.728-53.138286-254.866285-25.709714-52.553143-52.553143-87.990857-93.147429-130.304-13.129143-13.714286-41.728-39.424-41.728-60.013715 0-14.299429 14.848-29.696 29.147429-29.696 37.705143 0 92.013714 69.705143 112.018286 96.585143 76.580571 102.838857 109.129143 208.566857 117.723428 335.433143 0.585143 11.995429 1.133714 24.576 1.133715 36.571429z" fill="" p-id="2795"></path></svg></div>
              <div>Previewer</div>
            </div>
            <div id='previewHeadRight'><svg t="1659009144974" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2260" width="24" height="24"><path d="M216.64 747.093333l178.133333-178.176 60.373334 60.352-178.176 178.133334zM629.333333 455.04l178.133334-178.773333-60.373334-60.16-178.133333 178.56 60.373333 60.373333z" fill="#000" p-id="2261"></path><path d="M128 640v256h256L128 640zM896 384V128H640l256 256zM216.618667 276.949333l60.330666-60.330666 178.133334 178.133333-60.309334 60.373333zM568.96 629.333333l178.773333 178.133334 60.373334-60.373334-178.773334-178.133333-60.373333 60.373333z" fill="#000" p-id="2262"></path><path d="M384 128H128v256L384 128zM640 896h256V640L640 896z" fill="#000" p-id="2263"></path></svg></div>
          </div>
          <div id='preview'>
            {marked.parse(this.state.text)}
          </div>
        </div>
        
      </div>
    )
  }
  
}
const root=ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />)

[kinome79]

Um, could you re-submit your code into the forum for review, but make sure to mark it as code so that its formatted properly instead of having the browser translate it? You can do it be pasting your code, highlighting it, then clicking the code format buttom I show below to mark is at code in your reply.