title: CSS attribute-value selector doesn't work if value contains hash # sign
body: <p>Am using bootstrap LIKE dropdown menu with custom HTML5 attribute with <code>data-</code> as a prefix with a value starting from <code>#</code>, now for some reason I can't change this.</p>
  
  <p>Here's the <a href="http://labs.abeautifulsite.net/jquery-dropdown/" rel="nofollow noreferrer">script link</a> (It's like this <code>&lt;a href="#" data-dropdown="#dropdown-1"&gt;dropdown&lt;/a&gt;</code>)</p>
  
  <p>Now the issue is am using dynamic approach using PHP so child of an element changes often so I am not using <code>nth-child</code> so thought of using <code>attribute-value</code> selector but CSS doesn't accept if value contains <code>#</code>. Any workarounds for this?</p>
  
  <pre><code>&lt;div data-demo="works"&gt;This works&lt;/div&gt;
  &lt;br /&gt;
  &lt;div data-demo="#doesnt_works"&gt;This fails&lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>div[data-demo=works] {
      color: red;
  }
  
  div[data-demo=#doesnt_works] {
      color: green;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/jeq5W/" rel="nofollow noreferrer"><strong>Demo</strong></a></p>