Uncaught type error: Cannot set properties of null (Setting 'textContent)

Question

I am trying to get the user information that is written in a form to post the information provided once submitted to another HTML page.

This is the page with the form:

<form id="newBlog">

        <label for="btitle">Title of your blog</label>
        <input type="text" id="btitle" value="" placeholder="Title" required>

        <br>
        <br>

        <label for="bname">Author name</label>
        <input type="text" id="bname" value="" placeholder="Your full name" required>

        <br>
        <br>

        <textarea id="userBlog">

        </textarea>

        <br>
        <br>

        <button type="submit">
            Submit
        </button>

    </form>

    <script>
        const form = document.getElementById('newBlog');
        const blogTitle = document.getElementById('btitle');
        const authorName = document.getElementById('bname');
        const userBlog = document.getElementById('userBlog');

        form.addEventListener('submit', function(e) {
            e.preventDefault();

            const blogTitleValue = blogTitle.value;
            const authorNameValue = authorName.value;
            const userBlogValue = userBlog.value;

            localStorage.setItem('blog-title', blogTitleValue);
            localStorage.setItem('author-title', authorNameValue);
            localStorage.setItem('user-blog', userBlogValue);

            window.location.href = "index.html";
        })

And this is what is on the HTML page where the information should be posted:

    <script>
        const blogTitle = localStorage.getItem('blog-title');
        const authorTitle = localStorage.getItem('author-title');
        const userBlog = localStorage.getItem('user-blog');

        document.getElementById('b-title').textContent = blogTitle;
        document.getElementById('b-name').textContent = authorTitle;
        document.getElementById('user-Blog').textContent = userBlog;

    </script>

</body>

</html>

This is the error I got in console

I am not sure if posting the other functions of the code will help but do tell me If I need to. Thanks.

Answer 1

So the reason I was getting the error was because I didn't add a place to put the results of the form. I fixed this by adding:

<!-- Set where the new blog will be posted -->
<div>Blog Title: <br><span id="btitle"></span></div>
<div>Author Name: <br><span id="bname"></span></div>
<div>User Blog: <br><span id="userBlog"></span></div>

Thank you for all the answers and help and sorry for not seeing this before.