HTML Method Not Loading Value Using Document Ready

Question

Im trying to load the values for the bowflex column when the page is loaded, however they will not display. The .change event will load them, but the .ready doesn't. I'm sure this is an incredibly dumb oversight on my part, but why doesn't it load the value for "bowflex" on page load?

<div id="treadmill" style="float:left; padding-right: 15px;">
    <div><h2>Bowflex</h2></div>
    <div class="comparison1"></div>
</div>
<div id="treadmill2" style="float:left; padding-right: 15px;">
    <div><select class="row2">
          <option value="">Compare With</option>
          <option value="solo">Solo</option>
          <option value="nordictrack">Nordictrack</option>
          <option value="bowflex">Bowflex</option>
        </select></div>
    <div class="comparison2"></div>
</div>
<div style="clear:both"></div>

<script>
    var treadmill_dict = {
            bowflex: "<div class='motor'>5hp</div><div class='length'>50in</div><div class='weight'>500lbs</div>",
            solo: "<div class='motor'>4.5hp</div><div class='length'>45in</div><div class='weight'>450lbs</div>",
            nordictrack: "<div class='motor'>4hp</div><div class='length'>40in</div><div class='weight'>400lbs</div>"
    };

    $( document ).ready(function() {
        $('#treadmill div.comparison1').html(treadmill_dict[bowflex]);
    });

    $( ".row2" ).change(function() {
        $('#treadmill2 div.comparison2').html(treadmill_dict[$(this).val()]);
    });

</script>

Answer 1

If you are going to use json keys is way:

treadmill_dict[bowflex]

You need to put quotes around the key name:

treadmill_dict['bowflex']

Like this:

var treadmill_dict = {
    bowflex: "<div class='motor'>5hp</div><div class='length'>50in</div><div class='weight'>500lbs</div>",
    solo: "<div class='motor'>4.5hp</div><div class='length'>45in</div><div class='weight'>450lbs</div>",
    nordictrack: "<div class='motor'>4hp</div><div class='length'>40in</div><div class='weight'>400lbs</div>"
};

$(document).ready(function() {
    alert(treadmill_dict['bowflex']);
    $('#treadmill div.comparison1').html(treadmill_dict[bowflex]);
});

See it here