title: jquery ajax rendering of a new post in ruby on rails
body: <p>I'm trying to render the creation of a post with jquery ajax but I can't seem to get it to work correctly. It seems to render the post with very strange (I think nonexistent) styling and the flash message appears only after the page is refreshed. The post also get formatted correctly after the page is refreshed.</p>
  
  <p>Here's the javascript:</p>
  
  <pre><code>$("#micropost_form").before('&lt;div id="flash_notice"&gt;&lt;%= escape_javascript(flash.delete(:notice))%&gt;&lt;/div&gt;');
  $("#user_info").html("&lt;%= pluralize(current_user.microposts.count, "micropost") %&gt;");
  $("#feed_items").prepend(" &lt;%= escape_javascript(render(:partial =&gt; @micropost)) %&gt;")
  $("#micropost_form")[0].reset();
  </code></pre>
  
  <p>The body of my application layout:</p>
  
  <pre><code>&lt;body&gt;
  &lt;div class="container"&gt;
    &lt;%= render 'layouts/header' %&gt;
    &lt;section class="round"&gt;
  &lt;div id="flash_notice"&gt;&lt;%= render 'shared/flash_messages'%&gt;&lt;/div&gt;
      &lt;%= yield %&gt;
    &lt;/section&gt;
    &lt;%= render 'layouts/footer' %&gt;
    &lt;%= debug(params) if Rails.env.development? %&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Here's my home page (rendered in the <code>yield</code> of the application layout):</p>
  
  <pre><code>&lt;table class="front" summary="For signed-in users"&gt;
  &lt;tr&gt;
    &lt;td class="main"&gt;
      &lt;h1 class="micropost"&gt;What's happening?&lt;/h1&gt;
      &lt;%= render 'shared/micropost_form' %&gt;
      &lt;%= render 'shared/feed' %&gt;
    &lt;/td&gt;
    &lt;td class="sidebar round"&gt;
      &lt;%= render 'shared/user_info' %&gt;
      &lt;%= render 'shared/stats' %&gt;
    &lt;/td&gt;
  &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>Here's my feed partial:</p>
  
  <pre><code>&lt;% unless @feed_items.empty? %&gt;
   &lt;table id="feed_items" class="microposts" summary="User microposts"&gt;
    &lt;%= render :partial =&gt; 'shared/feed_item', :collection =&gt; @feed_items %&gt;
   &lt;/table&gt;
   &lt;%= will_paginate @feed_items %&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p>My flash messages partial:</p>
  
  <pre><code>&lt;% flash.each do |key, value| %&gt;
    &lt;div class="&lt;%= key %&gt;"&gt;&lt;%= value %&gt;&lt;/div&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p>Let me know if there's any other code I should post.</p>
  
  <p>So what am I doing wrong? If you want to look at all the code and run it locally to get a better understanding of what's happening, you can find it here: <a href="https://github.com/meltzerj/sample_app" rel="nofollow">https://github.com/meltzerj/sample_app</a></p>