load javascript with .html() truncated

Question

Environment:

• Version: jquery-3.1.0.js
• Agent: Chrome v51

I'd like to use ".html()" (or append) to load a pice of javascript and run it dynamic.

If the pice contains '<tr>', then the entire javascript just gone. But if the tag is '<p>', then everything goes fine.

I know JQ use wrapMap() to auto close some tag when build buildFragment(). But it will confuse people comparing with native "innerHTML" method.

Isn't it a jQuery bug? Or the designer meant to do this for a reason?

Code here

<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.js"></script>  
<div style="color:red;" id="out1"></div>
<div style="color:red;" id="out2"></div>
<div style="color:red;" id="out3"></div>   
<div style="color:red;" id="out4"></div>   

<script type="text/javascript">

var dom  = document.createElement('script');
var str1 = 'var a = "<tr>"; testFunc(a);';
var str2 = 'var a = "<p>"; testFunc(a);';

dom.innerHTML = str1;
$("#out1").text(dom.outerHTML);

$(dom).html(str1);
$("#out2").text(dom.outerHTML);

dom.innerHTML = str2;
$("#out3").text(dom.outerHTML);

$(dom).html(str2);
$("#out4").text(dom.outerHTML);

</script>  

Output here

DOM generated by innerHTML
<script>var a = "<tr>"; testFunc(a);</script>

DOM generated by .html()    
<script><tr></tr></script>

DOM generated by innerHTML    
<script>var a = "<p>"; testFunc(a);</script>

DOM generated by .html()    
<script>var a = "<p>"; testFunc(a);</script>