dynamically create accordion from jquery

Question

I have only a div in html page and i am trying to create an accordion from jQuery. But this does not happen.

HTML Code:

 <div data-role="content" id="Div1">
    <div id="accordion" data-role="collapsible-set"/>
 </div>

Java Script:

$(document).ready(function(){        
    $('#accordion').append("<div data-role=""collapsible""><h3>FirstFloor</h3><p>First Floor details</p></div>");        
});

JSFIDDLE

Answer 1

Your append string needs to be terminated with single quotes since you are using double quotes with it. Also you need to include Jquery library. If you are using the jquery accordion you also need to include the Jquery UI library.

Also your html is a bit off, here is a working example.

$('document').ready(function(){

$('#accordion').append('<h3>First Floor</h3><div>
<p>Welcome to da first floor.</p></div> 
<h3>Floor numbah 2</h3><div><p>you are now on floor 2</p></div>');
$( "#accordion" ).accordion();

});

http://jsfiddle.net/EEnSb/19/