Does anyone know why the line below results in the following line in HTML (note the case of "clip Path")

1. $('#designCanvas > defs').prepend('<clipPath id="clippingPath"></clipPath>');

1. <clippath id="clippingPath">
2.       <use x="0" y="0" width="300" height="300" xlink:href="#clip1"></use>
3.       <use x="0" y="0" width="100" height="100" xlink:href="#clip2"></use>
4. </clippath>