title: Json ajax seems to return data twice
body: <p>This code returns the data from the $.getJSON twice unless I activate the evnt.stopImmediatePropagation(); line, in which case no data is returned on my android mobile device:</p>
  
  <pre><code>$(document).on('click', '#LoginClick', function(evnt) {
  
  //    evnt.stopImmediatePropagation();
  
  // Find other players
  
  // Send a call to the backend for players
  var lilength = $('li').length;
  if (lilength == 0) {
    $.getJSON('http://www.cjneeds.com/ECG/getPlayers.php', function(Users) {
  
      // For each Player, add them to the list
      $.each(Users, function(i,User) {
  
        // Add each Player to the list
        $('&lt;li/&gt;').text(User['userName']).appendTo("#playerList");
      });
  
      // Refresh the list
      $("#playerList").listview('refresh');
    });
  }
  });
  </code></pre>
  
  <p>This is the html:</p>
  
  <pre><code>&lt;div id="LoginPage" data-role="page"&gt;
  
  &lt;div data-role="header"&gt;&lt;h1&gt;Login to ECG&lt;/h1&gt;
    &lt;a id="LoginClick" href="#LoginSubmit" title="Submit login details"&gt;Submit&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;div data-role="content"&gt;
    &lt;form&gt;
      &lt;div&gt;
        &lt;label for="UserName"&gt;User name&lt;/label&gt;
        &lt;input id="UserName" title="Enter your User Name" tabindex="1" type="text" placeholder="User name" maxlength="10" autofocus&gt;
      &lt;/div&gt;
      .
      .
      .
    &lt;/form&gt;
  &lt;/div&gt;
  
  &lt;div data-role="footer"&gt;&lt;h1&gt;Educational card games&lt;/h1&gt;
    &lt;a href="#" title="Retrieve your password"&gt;Lost PW&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  
  
  <pre><code>&lt;div id="LoginSubmit" data-role="page"&gt;
  
  &lt;div data-role="header"&gt;&lt;h1&gt;You're up against:&lt;/h1&gt;
     &lt;a href="#DisplayHand" title="See your cards and the upturned card"&gt;Play&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;div data-role="content"&gt;
    &lt;ol id="playerList" data-role="listview"&gt;
      &lt;!-- The &lt;li&gt; elements of Players go here. --&gt;
    &lt;/ol&gt;
  &lt;/div&gt;
  
  &lt;div data-role="footer"&gt;&lt;h1&gt;To see your cards click 'Play'&lt;/h1&gt;&lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>and the php on the server:</p>
  
  <pre><code>&lt;?php
  class User {
    public $userName;
    public $password;
    public $emailAddress;
    public $ageLast;
  }
  
  // Make a list for Users
  $Users = array();
  
  // Make new User 1
  $Users[0] = new User;
  $Users[0]-&gt;userName = 'John';
  $Users[0]-&gt;password = 'John';
  $Users[0]-&gt;emailAddress = 'john@email.com';
  $Users[0]-&gt;ageLast = '9';
  
  // Make new User 2
  $Users[1] = new User;
  $Users[1]-&gt;userName = 'Jane';
  $Users[1]-&gt;password = 'Jane';
  $Users[1]-&gt;emailAddress = 'jane@email.com';
  $Users[1]-&gt;ageLast = '8';
  
  // Make new User 3
  $Users[2] = new User;
  $Users[2]-&gt;userName = 'Sally';
  $Users[2]-&gt;password = 'Sally';
  $Users[2]-&gt;emailAddress = 'sally@email.com';
  $Users[2]-&gt;ageLast = '9';
  
  // Pass to client
  echo json_encode($Users);
  ?&gt;
  </code></pre>
  
  <p>and it returns this (when the evnt.stopImmediatePropagation(); line is remmed out):</p>
  
  <ol>
  <li>John</li>
  <li>Jane</li>
  <li>Sally</li>
  <li>John</li>
  <li>Jane</li>
  <li>Sally</li>
  </ol>
  
  <p>which seems to indicate that either the $.getJSON or the $.each is somehow executing twice?</p>
  
  <p>I tried to set up a <a href="http://jsfiddle.net/cneeds/YCnu2/#" rel="nofollow">fiddle</a> but could not get the json part to work properly.</p>