Element visible in body but can't be find by id

Element visible in body but can't be find by id

I am having an issue with finding certain id in my body with jquery.
As seen below I have created three logs each indexed with either 0,1 or 2.

0 - as expected returns empty object, though page hasn't loaded yet.
1 - returns empty object even though app already loaded and $("body") call returns object which includes
      the element I am looking for
2 - returns the element I am looking for

any advises how to solve my problem? I can't find why body object contains the element I am looking for, but the element itself is acting undiscoverable?

PS: const = App ... loads the app 
      and id's match i tried it several times just to make sure it's not the case.



  1. "use strict"

    const Elm = require('./elm.js'),
       $ = require('jquery')

    window.jQuery = $
    window.$ = $

    const TagsInput = require('./bootstraptagsinput.js')

    console.log("0", $('#tagsInputField'));

    $(document).ready(function() {

       const App = Elm.Search.fullscreen()

       console.log("1", $('#tagsInputField'));

       App.ports.addPort.subscribe((aggTag) => {
          console.log("2", $('#tagsInputField'));
       })

    })