title: How to make a checkbox part of the list item of a jquery-mobile split-con list
body: <p>I am trying to build a List that has a checkbox and an icon, so I decided to use a Split button List. Now I have 2 issues with the List:</p>
  
  <ol>
  <li>The Checkbox appears in a box within the list item, I want it to be "flat", i.e. NO box around</li>
  <li>The click causes the entire box to become blue, I want only the checkbox to get ticked</li>
  </ol>
  
  <p>Can you help me with that?</p>
  
  <p>I posted some example code here: <a href="http://jsfiddle.net/JY6EV/2/" rel="nofollow noreferrer">http://jsfiddle.net/JY6EV/2/</a></p>
  
  <p>//edit 2012/06/14
  It seems that having a checbox on a listitem alway nests a button. As a workaroud I could add an icon (data-icon="check") but this does not work either.. any suggestions?</p>
  
  <p>PS: I want to mimic the gmail list on iPad/iPhone:
  <img src="https://i.stack.imgur.com/LRn16.jpg" alt="Google Mails List on iOS">
  with my (faked) jquery mobile list:<img src="https://i.stack.imgur.com/aUNNZ.png" alt="jquery mimic of gmail"></p>
  
  <p>What I tried so far: <a href="http://jsfiddle.net/JY6EV/8/" rel="nofollow noreferrer">http://jsfiddle.net/JY6EV/8/</a></p>