Добавить кнопку закрытия на div

Question

Как я могу добавить кнопку закрытия в верхней части серого окна после того, как я нажму кнопку в первый раз? После нажатия на кнопку папки открытой, серая зона идет вверх, я хочу, чтобы добавить кнопку со значком {primary: "ui-icon-close"}, с JQuery UI http://www.petefreitag.com/cheatsheets/jqueryui-icons/

После нажатия этой кнопки х, я хочу $("#1").html(<div class="normal"><div>); поэтому коробка возвращается к зеленому снова ,

Это мой скрипку http://jsfiddle.net/3HauW/205/

Answer 1

Существует лучший способ сделать то, что вы хотите, но здесь работает пример существующего способа сделать это.

http://jsfiddle.net/3HauW/217/

изменения, которые я сделал:

var newHtml ='<div class="button_wrap ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" role="button" aria-disabled="false" title=""><span class="ui-button-icon-primary ui-icon ui-icon-close"></span><span class="ui-button-text"></span></div>'; 
    newHtml +="Blah Blah Blah"; 

И вот ...

$(function(){ 
    $('#1 .button_wrap').on('click', function(e){ 
     e.stopPropagation(); 
     $(".info").html(newHtml).show(); 

});}); 

И ДОБАВЛЕННЫЕ ЭТО

$(function(){ 
    $("#1").on("click", ".info .ui-icon-close", function(){ 
     $(".info").hide(); 
    }); 
}); 

И ЭТО ДЛЯ CSS

.info{ 
    top: 0; 
    width: 12.5em; 
    background-color:#cfcfcf; 
    overflow-y: auto; 
    display:block; 
    height:200px; 
    z-index:19; 
    color:black; 
    word-wrap:break-word; 
    position: absolute; 
    display: none; 
}