title: Get current value of search input on SharePoint
body: <p>Would like to get a pure Javascript solution for my situation.</p>
  <p>My HTML and JS is as follows. But the HTML can't be manipulated unfortunately as its on SP.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function getCurrentValue() {
    var searchQuery = document.getElementById("SearchBox").children[0].children[0].value;
    console.log(searchQuery);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="SearchBox"&gt;
    &lt;div id"randomGeneratedId"&gt;
      &lt;input type="text" value="Search..." id="anotherRandomGeneratedId"/&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;br/&gt;
  &lt;input type="button" value="Run!" onClick="getCurrentValue();"&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The JS above works in the snippet here but on my page it returns the default value of the input ie. &quot;Search...&quot;</p>
  <p>FYI its running on SharePoint 2013. I should note that I managed to get it to work when getElementId(&quot;anotherRandomGeneratedId&quot;) but that require writing a custom script for every page.</p>