title: Jquery click event of a div in li element not fired in mobile Safari
body: <p>Fixed: Finally I generate elements directly instead of being rendered by jQuery.</p>
  
  <p>Updated2: It seems clear about the real issue. I did a couple of tests, only one fired that I insert a link in it. but I don't want to bind the whole li element but a div element in a li.</p>
  
  <p>Updated: I did some modifications about positions of divs, it works in android now but mobile Safari even any elements in ul list.</p>
  
  <p>The following works in desktop Safari and Chrome but not their mobile versions. Any ideas? </p>
  
  <h3>js:</h3>
  
  <pre><code>$('#SubCategories &gt; li .likeRibbon').live('click', function () {
     ......
  });
  </code></pre>
  
  <h3>html:</h3>
  
  <pre><code>&lt;ul id="SubCategories"&gt;
        &lt;li id="st2" &gt;          
         &lt;div class="likeRibbon"&gt;Like?&lt;/div&gt;
        &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <h3>css:</h3>
  
  <pre><code>#SubCategories .likeRibbon
  {
      border-style: solid none solid none;
      border-width: 1px 0px 1px 0px;
      border-color: #565656;
      background-color: #565656;
      color: #333;
      text-shadow: 0 1px 0 #777, 0 -1px 0 black;
      line-height: 1;
      padding: 2px 0 5px 0;
      -moz-transform: rotate(-40deg);
      -ms-transform: rotate(-40deg);
      -o-transform: rotate(-40deg);
      -webkit-transform: rotate(-40deg);
      text-align: center;
      vertical-align: baseline;
      position: absolute;
      width: 100px;
      right: -35px;
      bottom: 5px;
  }
  </code></pre>