使用未显示的jQuery绘制SVG路径

Question

我正在尝试使用jQuery添加SVG的路径，特别是$path = $('<path />')

我遇到的问题是，在创建svg时，路径不会显示在浏览器中（Chrome）。这是一个图像和演示：

http://codepen.io/EightArmsHQ/pen/dMNzQW

红色框是svg，这里是相关代码（全部都在codepen中）

var connection_css = {
    'width' : w + 'px',
    'height' : h + 'px',
    'background' : 'red',
    'position' :'absolute',
    'top' : from.top,
    'left' : from.left
  };
console.log(connection_css);
var $svg = $('<svg />', {
  'width':w,
  'height':h,
  'css' : connection_css
});
var $path = $("<path />", {
  'd':"M0 0 L0 " + h +" L"+ w +" "+h,
  'stroke':'black',
  'stroke-width' : "6",
  'fill' : 'transparent'
});

你会看到没有线路。所以，奇怪的是，如果我将DOM元素复制并粘贴到HTML中，并注释掉我的所有JavaScript

你会看到我的盒子底部有一条光彩夺目的黑线。当我使用jQuery追加它时，为什么不显示？