I am trying to edit an element's input value. I am 100% sure it is loaded in the DOM. However, when I mess with it in console, it cannot find the element until I inspect it. Going by the token name property there is something going on. But because inspect seems to 'convert' it to be able to be found, surely there is a way to do it automatically?
Code in question: https://jsfiddle.net/h8oyLdv4/1/
If I put $('input') in the console it returns null. If I inspect any of the forms, it returns with
<input class="FORMshrt2" name="fd_co_firstname" type="text" maxlength="100" value="">
Also, document.querySelector('input') returns
<input type="hidden" name="csrfmiddlewaretoken" value="XXbWi2ygjOsJ8igaEa9MvFb5Nm7xznOD">
but once I inspect the element, it returns
<input class="FORMshrt2" name="fd_co_firstname" type="text" maxlength="100" value="">