表示するSVG外国要素？

Question

は、私は、SVGグループを持っていると私はそれの上にマウスを置くと、私はグループの追加要素を示したいと思います。 I（私は付加的な要素が隠されているgの上にマウスを置くと、例えば）、それが逆に作業を行う時点でのコードがあります。その後、 It works in reverse (JSfiddle)

をしかし、ボタンが最初に隠されているように、私はそれを変更したときとホバー上に表示されてもはや動作しません：How I actually want it.

私は申し訳ありません、私は組み込みのstackoverflowコードビューアを使用することができなかった、何とか動作することを拒否しました。

私はこの問題は、ボタンを囲むbodyタグは、ホーブイベントがトリガされた後もopacity: 0にとどまるということだと思います。ブラウザインスペクタで観察することは容易です。あなたは<button>要素自体にopacityを設定する必要が

Answer 1

：https://jsfiddle.net/7eoamnn4/

：

.html(`<button style="color: #000000; background-color: #FF8C00; 
    border: 1px solid #888888; opacity:0" class="connector-button"> 
    <i class="fa fa-arrows-v" aria-hidden="true"></i></button>`); 

をここでは、あなたの更新フィドルです