I had an issue today while trying to use a jQuery selector on simple div with ID “Ribbon.Read-Title”. This specific selector (#Ribbon.Read-Title) usually means that we are matching the ID “Ribbon” have the class “Read-Title”. But trying to match the ID “Ribbon.Read-Title” will simply not work with this selector. This is also true for a CSS selector.

The workaround is to escape the dot with a backslash. So in the above example, you would use selector #Ribbon\.Read-Title to match the specific ID “Ribbon.Read-Title”.

Note: Contrary to what some people believe, using a dot in an ID or Name attribute is totally valid and accepted, as specified by the W3C. However, it’s easy to confuse the default selector behavior for dots.