How to express a jQuery selector containing an XML namespace?

Question

I am trying to write my selector for jQuery. The attribute is xlink:href and the value is #_SAPGUI-icons_0_s_wfwire. I tried to construct it like this:

$('[xlink:href="#_SAPGUI-icons_0_s_wfwire"]')

I get a syntax error because of the expression [xlink:href="#_SAPGUI-icons_0_s_wfwire"].

Do you have any idea how to go about this?

Answer 1

The issue is because of the : in the selector. You need to escape it using \\, like this:

$('[xlink\\:href="#_SAPGUI-icons_0_s_wfwire"]').addClass('foo');

.foo { color: red; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div xlink:href="#_SAPGUI-icons_000">#_SAPGUI-icons_000</div>
<div xlink:href="#_SAPGUI-icons_0_s_wfwire">#_SAPGUI-icons_0_s_wfwire</div>
<div xlink:href="#_SAPGUI-icons_111">#_SAPGUI-icons_111</div>