How to append a jQuery variable value inside the .html tag

Question

I have a jquery variable which contains html tags to create checkboxes dynamically. Now as per my need i have to add this variable inside the .html tag of jquery to show the checkboxes inside the dialogue box ..Also my .html contains form tag to include the checkboxes code inside the form..

Here is my variabel which contains the html tags..

var chbx=<input type="checkbox"   id="Mumbai" name="Mumbai" value="Mumbai" />Mumbai<br />
<input type="checkbox"   id=" Delhi" name=" Delhi" value=" Delhi" /> Delhi<br />\
<input type="checkbox"   id=" Bangalore" name=" Bangalore" value=" Bangalore" /> Bangalore<br />

And here is my .html tag containing form ..

var $dialog = $('<div></div>').html("<form id='myform'>" +chbx+ "</form>")
        .dialog({
            autoOpen: false,
            title: 'Select Sites',
            buttons: {
                "Submit": function() {  $('form#myform').submit();},
                "Cancel": function() {$(this).dialog("close");}
            }
        });

i tried to append the variable like +chbx+ but its not happening and showing empty dialogue box..

Answer 1

HTML :

<div id="myDiv">
    <form id="myForm">
    </form> 
</div>

jQuery :

var chbx='<input type="checkbox" id="Mumbai" name="Mumbai" value="Mumbai" />Mumbai<br /> <input type="checkbox" id=" Delhi" name=" Delhi" value=" Delhi" /> Delhi<br/><input type="checkbox" id=" Bangalore" name=" Bangalore" value=" Bangalore"/>Bangalore<br />';

$("#myDiv form#myForm").html(chbx);

//to insert dynamically created form 
$("#myDiv").html("<form id='dynamicForm'>" +chbx + "'</form>");

Demo