jquery - alert close button is not showing in jquery .html() in ruby on rails

Question

I am using AJAX crud operation in my rails application with twitter bootstrap. When i click on submit post then success flash message is showing but along with that close button is not showing.

here is my code ...

<div id="flash_notice" class="alert span6"></div>

here is my form...

 <%= form_for(@post, :remote => true, :html => {:id => "prayer_form"}) do |f| %>
 <div id= "post_errors" style="display:none"></div>
 <p>
  <%= f.select :title, options_for_select(["Relationship", "Family", "Health",   "Personal", "Professional", "Education", "Tours & Travel", "Exams", "Job", "Society", "Career", "Marriage", "Relationship", "Friendship", "Event", "Success/Failure", "others"]), {:include_blank => "Select Prayer Category"}, {:multiple => false,:class => "required"} %>
 </p>
 <p>
  <%= f.text_area :content, :rows => 5, :class=>"span12 required", :placeholder => "Create your prayer" %>
 </p>
 <p><%= f.submit "Add Prayer", :class=>"btn btn-primary"%></p>
<% end %>

here is my create.js.erb

  $("#post_errors").hide(300);
  $("#flash_notice").html("<%= escape_javascript(flash[:notice] <button type='button' class='close' data-dismiss='alert'>&times;</button>) %>");
  $("#flash_notice").show(300);
  $(":input:not(input[type=submit])").val("");
  $("#posts_list").html("<%= escape_javascript( render(:partial => "posts") ) %>");

application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .

flash alert is showing but why my close icon button is not showing. Please help

Answer 1

You don't need to mix escape_javascript with real html code. HTML code doesn't need to go through Rails.

Try replace this

$("#flash_notice").html("<%= escape_javascript(flash[:notice] 
<button type='button' class='close' data-dismiss='alert'>&times;</button>) %>")

With this

$("#flash_notice").html("<%= escape_javascript(flash[:notice] %>" + 
"<button type='button' class='close' data-dismiss='alert'>&times;</button>")