title: Replacing content in <p> in jQuery
body: <p>This is a jQuery function that should accumulate a variable called p1 or p2 depending on the class of the td clicked. It should then append this to the paragraphs <code>cheap</code> and <code>premium</code> depending on the class. The function to write to the class is at the bottom, although I feel that this might be incorrect since the variable in the paragraph probably won't update at the same time as the variable. Also the bottom function doesn't actually do anything.</p>
  
  <pre><code>$(document).ready(function () {
     $('td img').click(function () {
       if ($(this).parent().hasClass('x')) {
       alert("Seat " + ($(this).parent().attr("id")) + " is taken");
          } else if ($(this).parent().hasClass('selected')){
       $(this).attr('src', 'images/a.gif');
       $(this).parent().removeClass('selected');
   var z = $(this).parent().attr('id');
   $('#'+z+'1').remove();
       return false;
      } else {
          if ($(this).parent().hasClass('n')){
      p1=p1+1;                
      } else if ($(this).parent().hasClass('p')){
      p2=p2+1;
      }
  $(this).attr('src', 'images/c.gif');
      $(this).parent().addClass('selected');
      alert($(this).parent().attr("class"));
  var z = $(this).parent().attr('id');
  $('&lt;p&gt;').attr('id', z+'1' ).text(z).appendTo('#order');
      return false;
         };
      });
    });
  
  $(document).ready(function(){
  $(p1' Standard seats= £'(p1*10)).appendTo('#cheap');
  $(p2' Premium seats= £'(p2*20)).appendTo('#premium');
  });
  </code></pre>
  
  <p>The mathematical operators appear to work, but what I'm looking for is a way to append <code>$(p1' Standard seats= £'(p1*10)).appendTo('#cheap');</code> or the premium equivalent without it adding a new paragraph each time-ie and overwrite or similar. <code>replaceWith()</code> doesn't appear to work either. </p>
  
  <p>HTML added: </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;&lt;title&gt;Seat Booking&lt;/title&gt;
  &lt;script type='text/javascript' src='jquery.min.js'&gt;&lt;/script&gt;
  &lt;script type='text/javascript' src='hall.js'&gt;&lt;/script&gt;
  &lt;link rel='stylesheet' href='hall.css'/&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id='content'&gt;&lt;/div&gt;
  &lt;h1&gt;Seat Booking&lt;/h1&gt;
  &lt;div id='details'&gt;
  &lt;div id='what'&gt;&lt;/div&gt;
  &lt;div id='when'&gt;&lt;/div&gt;
  &lt;div id='where'&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div id='plan'&gt;
  &lt;table&gt;
    &lt;tr&gt;
     &lt;td class='n' id='a1'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a2'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a3'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a4'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td&gt;&lt;/td&gt;
     &lt;td class='n' id='a6'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a7'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a8'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='a9'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
     &lt;td class='n' id='b1'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b2'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b3'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b4'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td&gt;&lt;/td&gt;
     &lt;td class='n' id='b6'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b7'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b8'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='b9'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
     &lt;td class='n' id='c1'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='c2'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='c3'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='c4'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td&gt;&lt;/td&gt;
     &lt;td class='n' id='c6'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='c7'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='C8'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='C9'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
     &lt;td class='n' id='d1'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d2'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d3'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d4'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td&gt;&lt;/td&gt;
     &lt;td class='n' id='d6'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d7'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d8'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='n' id='d9'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
     &lt;td class='p' id='e1'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e2'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e3'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e4'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td&gt;&lt;/td&gt;
     &lt;td class='p' id='e6'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e7'&gt;&lt;img src='images/a.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e8'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
     &lt;td class='p' id='e9'&gt;&lt;img src='images/1.gif'/&gt;&lt;/td&gt;
   &lt;/tr&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  &lt;div id='order'&gt;
  &lt;h2&gt;Order Summary:&lt;/h2&gt;
  &lt;/div&gt;
  &lt;div id='subtotal'&gt;
  &lt;h2&gt;Total Price&lt;/h2&gt;
  &lt;p id="cheap"&gt;hhh&lt;/p&gt;
  &lt;p id="premium"&gt;jjj&lt;/p&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>