jQuery .appendTo() [IE] - Images do not render unless I resize the browser window
<p>I am using the jQuery functions <code>.render()</code> and <code>.appendTo</code> to render images and text on a page, specifically into a placeholder/template. It works well in Firefox and Chrome. But, in IE, the images do not render automatically. The word 'image' appears instead. If I resize the browser window (maximize, resize, or open/close Dev Tools) the images show up. </p>

<p>I came across <a href="https://stackoverflow.com/questions/7742781/why-javascript-only-works-after-opening-developer-tools-in-ie-once">this thread</a>, because initially I only thought it happened on opening Dev Tools, but I did not find anything useful. My JS does not use any console calls, and I tried using cache: false in my ajax calls, but that did not work.</p>

<p>The template markup that the JS is targeting:</p>

<pre><code>@using (Html.BeginBeforeBodyClosePlaceHolder())
{
    &lt;script id="gridItemTemplate" type="text/html"&gt;
        &lt;div class="content-block__one-third"&gt;
            &lt;div class="add-display-block centered-text add-top-margin add-bottom-margin"&gt;
                &lt;a href="${ItemUrl}" class="link-undressed"&gt;
                    &lt;picture&gt;
                        &lt;img class="flex" srcset="${ThumbnailPhotoUrl}?quality=80&amp;width=500&amp;mode=crop&amp;format=jpg 1x, ${ThumbnailPhotoUrl}?quality=80&amp;width=500&amp;mode=crop&amp;format=jpg 2x" alt="image"/&gt;
                    &lt;/picture&gt;
                &lt;/a&gt;
                &lt;a href="${ItemUrl}" class="link-undressed"&gt;
                    &lt;h3 class="uppercase no-bottom-margin"&gt;${ThumbnailItemTitle}&lt;/h3&gt;
                &lt;/a&gt;
                {{if $(ThumbnailItemDescription) != null &amp;&amp; $(ThumbnailItemDescription) != ""}}
                    &lt;p class="no-top-padding no-top-margin sm-text"&gt;${ThumbnailItemDescription}&lt;/p&gt;
                {{/if}}
                {{if $(ThumbnailItemDate) != null &amp;&amp; $(ThumbnailItemDate) != ""}}
                    &lt;p class="no-top-padding no-top-margin sm-text"&gt;${ThumbnailItemDate}&lt;/p&gt;
                {{/if}}
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/script&gt;
}
</code></pre>

<p>The JS:</p>

<pre><code>$(function () {
   $('#btnSeeMore').click(function (e) {
    var lastContentBlock = $('#subItemGrid').children('div.content-block__one-third').last();
    var gridItemId = lastContentBlock.siblings('input#GridItemId').last().val();

    // Get the number of content blocks currently within the subItemGrid
    var gridItemCount = $('#subItemGrid').children('div.content-block__one-third').length;

    var anchor = lastContentBlock.find('a');
    if (anchor != null &amp;&amp; anchor.length &gt; 0) {
        var ahref = anchor.attr('href');
        var slashIndex = ahref.lastIndexOf('/');
        var itemName = ahref.substring(slashIndex + 1);
        var itemType = "";

        if (ahref.indexOf('recipe') &gt; 0) {
            itemType = "Recipe";
        } else if (ahref.indexOf('news') &gt; 0) {
            itemType = "News Article";
        } else if (ahref.indexOf('event') &gt; 0) {
            itemType = "Event";
        }

        $.get('/api/WFBC/GetNextContentItems', { itemType: itemType, lastItemName: itemName }, function (data) {
            if (data.success) {
                // Slide the See More button down
                $('#gridItemTemplate').render(data.nextItems).appendTo('div.content-block');
                if (data.endOfItems) {
                    // Disable the See More button
                    $('#btnSeeMore').attr('disabled', 'disabled');
                }
            } else {
                // Disable the See More button
                $('#btnSeeMore').attr('disabled', 'disabled');
            }
        });
    } else {
        var itemGuid = $('#ItemGuid').val();
        $.get('/api/WFBC/GetNextGridItems', { gridItemId: gridItemId, gridItemCount: gridItemCount, pageItemGuid: itemGuid }, function (data) {
            if (data.success) {
                // Slide the See More button down
                $('#gridItemTemplate').render(data.nextItems).appendTo('div#subItemGrid');
                if (data.endOfItems) {
                    // Disable the See More button
                    $('#btnSeeMore').attr('disabled', 'disabled');
                }
            } else {
                // Disable the See More button
                $('#btnSeeMore').attr('disabled', 'disabled');
            }
        });
    }
});
});
</code></pre>

<p>What could be causing IE to not render the images automatically?</p>