title: Append a div without refreshing jquery
body: <p>I want to add a div without refreshing the page.</p>
  
  <p>Here is my Javascript:</p>
  
  <pre><code>&lt;input class="btnsubmit"  type="button" value="+Add Trivia" id="add_triviamodal"&gt; 
  
  function add_trivia()
  {
      var PHOTO_TRIVIA = CKEDITOR.instances.Trivia_Photo.getData();
      var TITLE_TRIVIA = $('#TRIVIA_TITLE').val();
      var CAPTION_TRIVIA = CKEDITOR.instances.triviacap.getData();
  
  $.post('insert_home.php',{TRIVIA_TITLE:TITLE_TRIVIA,TRIVIA_PHOTO:PHOTO_TRIVIA,TRIVIA_CAP:CAPTION_TRIVIA}).done(function(data){
      alert ("Trivia Successfully Added");
          location.reload(); \\what i do is just refresh the page
      });
  }
  </code></pre>
  
  <p>This is how i output the the data that will be added using the ajax above</p>
  
  <pre><code> echo "&lt;div class=\"view view-sixth\"&gt;
  
                ".$Tri_IMAGE."
  
  
               &lt;div class=\"mask\"&gt;
               &lt;div class=\"divbutton\"&gt;
               &lt;input  onclick='TRIVIA_EDIT($Tri_ID);' class=\"btnsubmit\"  type=\"button\" value=\"Edit\" id=\"edit_trivia\"&gt;
               &lt;input  onclick='TRIVIA_DELETE($Tri_ID,this);' class=\"btnsubmit\"  type=\"button\" value=\"Delete\" id=\"delete_trivia\"&gt;
               &lt;/div&gt; 
               &lt;h2&gt;".$Tri_TITLE."&lt;/h2&gt;
               &lt;p&gt;".$Tri_CAPTION."&lt;/p&gt;
               &lt;/div&gt;
              &lt;/div&gt;";
  }
  </code></pre>