Scrollspy with symbols in id

Question

I've got scrollspy working just perfectly, however it skips the items that contain a plus-sign (+) in their id's, affixes aswell. Is there any workaround here except for trimming the id's? I prefer the + signs in the id for SEO reasons and the id's are dynamically generated and reused in other code so I prefer to keep them this way.

<nav id="sidebarnav">
    <ul class="nav">
        <li class="active"><a href="#works">works</a></li> 
        <li><a href="#skip+it">Skip it</a></li> <!-- thisone it will skip -->
        <li class=""><a href="#also">also</a></li> 
        <li class=""><a href="#this">this</a></li>
    </ul>
</nav>

Answer 1

plus signs are not allowed in id values, see: What characters are allowed in DOM IDs?. Why should using plus signs help your SEO? Maybe also read: URL encoding the space character: + or %20?.

Consider to replace the + with a _