title: trying to create product list with jquery mobile
body: <p>I need to make a list of products and want to be able to add number of products independently directly on list with two + - buttons. Here is code... </p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;ul data-role="listview"&gt;
     &lt;li data-icon="false"&gt;&lt;a href=""&gt;
         &lt;img src="images/1.jpg" alt="" /&gt; text, text&lt;/a&gt;
             &lt;div data-role="fieldcontain"&gt;
                &lt;button class="plus" id="1" data-icon="plus" data-iconpos="notext"&gt;Plus&lt;/button&gt;
                &lt;button class="minus" data-icon="minus" data-iconpos="notext"&gt;Minus&lt;/button&gt;
                 &lt;p class="p"&gt;&lt;span class="number"&gt;0&lt;/span&gt;&lt;/p&gt;
           &lt;/div&gt;
     &lt;/li&gt;
     &lt;li data-icon="false"&gt;&lt;a href=""&gt;
         &lt;img src="images/1.jpg" alt="" /&gt;text, text&lt;/a&gt;
             &lt;div data-role="fieldcontain"&gt;
                 &lt;button class="plus" id="1" data-icon="plus" data-iconpos="notext"&gt;Plus&lt;/button&gt;
                 &lt;button class="minus" data-icon="minus" data-iconpos="notext"&gt;Minus&lt;/button&gt;
                 &lt;p class="p"&gt;&lt;span class="number"&gt;0&lt;/span&gt;&lt;/p&gt;
             &lt;/div&gt;
       &lt;/li&gt;
       &lt;li data-icon="false"&gt;&lt;a href=""&gt;
           &lt;img src="images/1.jpg" alt="" /&gt;text, text&lt;/a&gt;
               &lt;div data-role="fieldcontain"&gt;
                  &lt;button class="plus" id="1" data-icon="plus" data-iconpos="notext"&gt;Plus&lt;/button&gt;
                  &lt;button class="minus" data-icon="minus" data-iconpos="notext"&gt;Minus&lt;/button&gt;
                  &lt;p class="p"&gt;&lt;span class="number"&gt;0&lt;/span&gt;&lt;/p&gt;
              &lt;/div&gt;
       &lt;/li&gt;
  &lt;/ul&gt;
  &lt;a href="#" data-role="button" data-inline="true"&gt;Order&lt;/a&gt;
  &lt;a href="#home" data-role="button" data-inline="true"&gt;Home&lt;/a&gt;
  </code></pre>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>var $number = 0;
  
  $('.plus').click(function () {
      $number++;
      $('.number').text($number).css('color', '#97bf0d');
  });
  
  $('.minus').click(function () {
      if($number &gt; 0){
          $number--;
      }
      $('.number').text($number);
  });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/Skc9w/1/" rel="nofollow">jsfiddle example</a></p>