Code functioning in JSFiddle environment but not when run otherwise

Question

So when working on another question, here, I got a great answer from @earl3s and a link to a jsfiddle of the work and it appeared to work fine but when trying to run it in repl.it it gave me an error, and when trying to run it locally I got an error reading "Uncaught TypeError: Cannot read property 'add' of null" on line 19. I may be submitting them wrong or the code may be written incorrectly, and insight would be appreciated. Here is the origninal code:

<script>
    if (window.location.href.substring(0,9) === "http://ww") {
    var home_var = "bing.com";    
    }
    else if (window.location.href.substring(0,9) === "https://p") {
    var home_var = "https://px.multiscreensite.com/index.php?url=bing.com";
    }
    else {
    var home_var = "1";
    }
    var select= document.getElementById("mySelect");
    var option = document.createElement("option");
    option.text = "Hope Page";
    option.value = home_var;
    select.add(option);
    console.log(home_var);
</script>

<select id="mySelect" OnChange="window.location.href=this.value">
    <option>Tagged Stuff and Navigation</option>
</select>

Answer 1

In JSFiddle, the JavaScript is automatically loaded after the document loads. In repl, you had the JavaScript inserted before the dom actually loaded, so mySelect didn't exist then. You have to add the JavaScript after the dom loads, i.e. at the end of the body tag.

Here's a working example.