title: Trouble styling a disabled image button jQuery Mobile
body: <p>I'm again at a loss here. I have tried a ton of different things to get this image button to look disabled WITHOUT losing my image. I am providing the Javascript here of how the button is disabled:</p>
  
  <pre class="lang-js prettyprint-override"><code>$('#button2').attr('data-href', $('#button2').attr('href'));
  $('#button2').attr('data-onclick', $('#button2').attr('onclick'));
  $('#button2').attr('href', '#');
  $('#button2').attr('onclick', 'return');
  $('#button2').button('disabled');
  </code></pre>
  
  <p>This is my HTML of the button that is being disabled based on what the user is allowed to look use in this application:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div data-role="content" &gt;
    &lt;div class="ui-grid-a"&gt;
      &lt;div class="ui-block-a"&gt;
        &lt;a  href="page1.html" data-role="button" data-transition="flip" id="button1"&gt;&lt;img src="image.png" alt="Browse" /&gt;&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="ui-block-b"&gt;
        &lt;a href="page2.html" data-role="button" data-transition="flip" id="button2"&gt;&lt;img src="image.png" alt="Search" /&gt;&lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And finally this is the CSS I have been working with that I have seen documented to work with CSS3:</p>
  
  <pre class="lang-css prettyprint-override"><code>button[disabled],
  button[disabled]:active {
      background: #000;
  }
  </code></pre>