Search code examples
javascriptinnerhtmlselectors-api

Change innerHTML to id and add div to <p> with querySelectorAll


I'm new to javascript. I'm trying to have my h1 show the title of the document instead (which is also Document by the way). Instead, it recognises 'title' as string and not as an id. I don't know what I'm doing wrong here. I also tried to add my roze div class to

by using querySelectorAll, but this also is not working. Who can help me? I'm sure its something simple but I've been trying to understand this for the past 3 days...[the html][the js][the css][my page in edge]

I've tried to use no '' in ('h1'), ('title') and ('p'). I've tried using . and # before ('h1'), ('title') and ('p'). I've tried removing id from title tag and h1 and have googled for methods but I still can't find an example of the specific method I have to do.


Solution

  • To get an DOM element by its id you should use document.getElementById('title'). To edit its text you should use its textContent property. The title of the docuemnt is stored in document.title.

    Try the following markup:

    document.getElementById('title').textContent = document.title
    
    <h1 id="title">Dit is h1</h1>