title: show div upon form submit, works in Chrome, FF, IE but not Safari
body: <p>Not sure where to go with this.</p>
  
  <p>I have a form, which when submitted, I would like to display a "processing, please wait" message. (The form has photos to upload so might take a while)</p>
  
  <p>I have the following jQuery</p>
  
  <pre><code>$(document).ready(function() {
      $('#addnews').submit(function() {
          $('#loading').show();
      });
  });
  </code></pre>
  
  <p><strong>addnews</strong> is my form id,
  and the div in my template is</p>
  
  <pre><code>&lt;div id="loading"&gt;Please wait, your news is being submitted...
      &lt;img src="/-/images/addwalk-loader.gif"/&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>with this css</p>
  
  <pre><code>#loading{
      display:block;
      display: none;
      background:#399f8a;
      color:#FFFFFF;
      font-weight: bold;
      text-align: center;
      border-radius: 3px;
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      padding:10px;
      margin-top: 10px;
  }
  
  .loading img{
      float: right;
  }
  </code></pre>
  
  <p>Now this is working when I hit Submit in FF(Mac), Chrome(Mac&amp;PC) and IE9(although the gif does not animate, but I know thats a separate issue)</p>
  
  <p>but it does not seem to want to work on Safari on the mac. 
  Any ideas, if theres something in what I have thats stopping it? Or what the best way to debug it is?
  Thanks!</p>