JSFiddle - React, Tailwind, and code Playground

by Andrew Gerst

HTML

<span id="A.B"><a>Period Test</a></span><br/>
<span id="A.C"><a>Period Test 2</a></span><br/>
<span id="A:B"><a>Colon Test</a></span><br/>
<span id="A:C"><a>Colon Test 2</a></span><br/>
<span id="A-B"><a>Dash Test</a></span><br/>
<span id="A-C"><a>Dash Test 2</a></span><br/>

CSS

#A\.B{color:#f00}
#A.C{color:#f00}
#A\:B{color:#0f0}
#A:C{color:#0f0}
#A-B{color:#00f}
#A\-C{color:#f0f}

JavaScript

alert($("#A.B").find('a').length);
alert($("#A\\.B").find('a').length);
alert($("#A:B").find('a').length);
alert($("#A\\:B").find('a').length);
alert($("#A-B").find('a').length);
alert($("#A\\-B").find('a').length);