Kim Gwanyoung
Kim Gwanyoung

Reputation: 27

'TypeError : element is null'. when invoke the getElementById in javascript

I'm trying to make my web page with pug.
When I clicked the 'mod user' button, the browser should show one of user names.
My index.js is follows.

block content
    div(class='s1tablediv')
        div(class='userListContainer')
            div(class='userInfo' id='userInfo')
                p(id='userID')

        script.
            function fuserInfo(arg) {
                $('.userInfo').text('');
                var userIdElem = document.getElementById('userID');
                userIdElem.innerHTML = arg.innerHTML;
            }

But, when I clicked the button, I got 'TypeError: userIdElem is null'.
If change the code like this,

            div(class='userInfo' id='userInfo')
            p(id='userID')  // unindent one level.

It works well.
Please tell me why.

Upvotes: 0

Views: 105

Answers (1)

Akash
Akash

Reputation: 2803

When Script Start to Evaluate

$('.userInfo').text(''); Removes Paragraph With Id UserID Then You Try To Select The ID with document.getElementById('userId')

Because It's No More In DOM it returns Null

Upvotes: 1

Related Questions