How to pick up element by id within a block returned by getElementById()

Question

Following...

I want to find an element (form) that is inside a block. I use the .getElementById(); to get this block.

After I get the block, I want to find the form that’s in this block so I can include an element before this form. I’m trying this way, and so far, I haven’t been able:

javascript

var boardElem = document.getElementById('board-01');
var formEl = boardElem.children('#formNewTask');

It didn’t work... so I tried to use it like this too:

var formEl = boardElem.getElementById('formNewTask');

And the error generated is this:
Uncaught Typeerror: boardElem.getElementById is not a Function

I’m used to jQuery. But I’m developing a project without using the framework. Some light?

Thank you!

Answer 1

I got...

I solved the problem. I needed a p/find selector element. I tried the children, getElementById, getElementByTagName, ...

And I wasn’t remembering the main... the querySelector.

It worked that way:

var boardElem = document.getElementById('board-01');
var formEl = boardElem.querySelector('form');
boardElem.insertBefore(novoElemento, formEl);

Like I’ll only have one form within the board, I will not use ID. It is the name of the tag as parameter in the selector. I was suffering from this!