IE 11 Bug with Dynamic SVG Elements?

I have come across a bug that is difficult to explain.

I recently implemented an SVG Icon control for my company's new html application. Shortly afterward our quality department started reporting that IE 11 randomly "crashes" when using the application. I use the quotes because I am not sure the term crash accurately describes what is happening. The application gets to a state where elements will no longer accept mouse or keyboard events nor will it show hover styles however the cursor image will change appropriately as you hover over buttons and input element and scrollable sections can be scrolled.

When the application gets to this state there are no client side scripts running, just IE's garbage collector. After a week of testing I finally determined that the state is triggered when the user clicks on an icon generated with a svg <use> element when the click event fires a function that removes the svg <use> element from the DOM.

I created a test site to help explain and reproduce the issue:

http://codepen.io/GooeyIdeas/full/WvpPzP/

And if you are not a fan of codepen:

Base Recreation Markup (W/ Knockout JS Library):

HTML:

<div data-bind="click: toggleLock"><!-- ko if: isLocked    --><svg class="ux-icon-svg" width="24" height="24"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#locked"></use></svg><!-- /ko --><!-- ko ifnot: isLocked --><svg class="ux-icon-svg" width="24" height="24"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#unlocked"></use></svg><!--/ko--></div><svg xmlns="http://www.w3.org/2000/svg" id="svg-icons"><symbol viewBox="0 0 24 24" id="unlocked"><path d="M18,9h-1V7c0-2.8-2.2-5-5-5S7,4.2,7,7h1.9c0-1.7,1.4-3.1,3.1-3.1s3.1,1.4,3.1,3.1v2H6c-1.1,0-2,0.9-2,2v9c0,1.1,0.9,2,2,2
             h12c1.1,0,2-0.9,2-2v-9C20,9.9,19.1,9,18,9z"></path></symbol><symbol viewBox="0 0 24 24" id="locked"><path d="M18,9h-1V7c0-2.8-2.2-5-5-5S7,4.2,7,7v2H6c-1.1,0-2,0.9-2,2v9c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2v-9C20,9.9,19.1,9,18,9z
             M15.1,9H8.9V7c0-1.7,1.4-3.1,3.1-3.1s3.1,1.4,3.1,3.1V9z"></path></symbol></svg>

Javascript:

function AppViewModel() {
    var self = this;
    this.isLocked = ko.observable(false);
    this.toggleLock = function(){
      self.isLocked(!self.isLocked.peek())
    }
}

ko.applyBindings(new AppViewModel());

Has anyone encountered this before? Should I enter this as a bug? Do I need to clarify anything?