JSFiddle - React, Tailwind, and code Playground

by efta

HTML

<script src="http://github.com/DmitryBaranovskiy/raphael/raw/master/raphael-min.js"></script>
    <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' baseProfile='full' width='200' height='200'>
    <circle cx='200' cy='200' r='150'  fill="green" stroke="black" />
    </svg>

JavaScript

var paper = Raphael(10, 50, 320, 200);
var circle = paper.circle(50, 40, 10);
circle.attr("fill", "#f00");
circle.attr("stroke", "#fff"); 

console.log( "jQuery('[fill]'):"+jQuery('[fill]').length );
console.log( "jQuery('@[fill]'):"+jQuery('@[fill]').length );

/*
In Opera developer tools jQuery('[fill]') returns array where the SVG elements are HTMLUnknownElement - they are only these defined in HTML. The dynamically defined from Raphael are missing.

When invoke jQuery('@[fill]') it returns array where SVG elements are both HTMLUnknownElement (these from HTML) and SVGCircleElement(these from Raphael).

What kind of selector is @? 

same configuration on http://grozdeva.com/test/

*/