javascript - svg スタイルを適切に取得して Raphael に追加する方法は?

Question

svg ファイルがあり、Raphael ライブラリを使用しています。私のsvgファイルには次のスタイルが含まれています：

<defs>
  <style type="text/css">
   <![CDATA[
    .fil1 {fill:#2B2A29}
    .fil0 {fill:#009846;fill-opacity:1}
    .fnt0 {font-weight:bold;font-size:10.9996;font-family:'Arial'}
   ]]>
  </style>
  <filter id="Filter" filterUnits="userSpaceOnUse" x="0" y="0" width="660" height="400">
    <feGaussianBlur in="SourceAlpha" stdDeviation="3" result="blur"/>
    <feOffset in="blur" dx="0" dy="3" result="offsetBlur"/>
    <feMerge>
        <feMergeNode in="offsetBlur"/>
        <feMergeNode in="SourceGraphic"/>
    </feMerge>
  </filter>
 </defs>

このオンライン ツールを使用して、この svg ファイルをRaphaelI に変換します。このツールは私のスタイルを挿入しません。そして、次のマークアップを取得します。

<svg height="400" version="1.1" width="660" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative;"><desc>Created with RaphaГ«l 2.1.0</desc><defs/><path style="stroke-opacity: 1;" fill="#000000" stroke="#000000" d="M296,116L297,118L343,124L375,105L366,94L339,88L320,98L319,98Z" stroke-width="0" stroke-opacity="1"/>

...

ご覧のとおり、defsタグは空です。

スタイルを手動で追加しようとしました：

$('defs').append('<style type="text/css"><![CDATA[.fil1 {fill:#2B2A29}.fil0 {fill:#009846;fill-opacity:1}.fnt0 {font-weight:bold;font-size:10.9996;font-family:'Arial'}]]></style><filter id="Filter" filterUnits="userSpaceOnUse" x="0" y="0" width="660" height="400"><feGaussianBlur in="SourceAlpha" stdDeviation="3" result="blur"/><feOffset in="blur" dx="0" dy="3" result="offsetBlur"/><feMerge><feMergeNode in="offsetBlur"/><feMergeNode in="SourceGraphic"/></feMerge></filter>');

しかし、私はエラーが発生します:

missing ) after argument list

...ght:bold;font-size:10.9996;font-family:'Arial'}]]></style><filter id="Filter" fi...

svg スタイルを適切に取得して追加するにはどうすればよいRaphaelですか?