create checkbox dynamically using DOM JavaScript in XUL

I want to create checkbox dynamically using DOM JavaScript in XUL for tree values: This function is used to get the values of my XUL tree:

function choose() {
  var tree = document.getElementById('myTodoListTree');
  for (var i = 0; i < tree.view.rowCount; i++) {
    if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 'true'){
      alert(
        tree.view.getCellText(i, tree.columns.getNamedColumn("name"))+"\n"+
        tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"))+"\n"+
        tree.view.getCellText(i, tree.columns.getNamedColumn("gmail"))+"\n"+
        tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo"))+"\n"+
        tree.view.getCellText(i, tree.columns.getNamedColumn("url"))+"\n"+
        tree.view.getCellText(i, tree.columns.getNamedColumn("facebook-id"))
      );
      var firstName= tree.view.getCellText(i, tree.columns.getNamedColumn("name"));
      var lastName= tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"));
      var Gmail= tree.view.getCellText(i, tree.columns.getNamedColumn("gmail"));
      var Yahoo= tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo"));
      var Facebook = tree.view.getCellText(i, tree.columns.getNa开发者_StackOverflowmedColumn("url"));
      var FacebookId = tree.view.getCellText(i, tree.columns.getNamedColumn("facebook-id"));
    }
  }
  return arr;                   
} 

This mybox, and I want to append the dynamically created groupbox check-boxes in this box:

---

Finally, I have learnt how to create elements dynamically.

This is the solution: Here I have created group-box, caption and check-box dynamically.

function choose()
{
alert('hi');
  var tree = document.getElementById('myTodoListTree');
  for (var i = 0; i < tree.view.rowCount; i++) {
   if (tree.view.getCellValue(i, tree.columns.getColumnAt(0)) == 'true'){

var empty = " ";
var contact = (tree.view.getCellText(i, tree.columns.getNamedColumn("name"))+ empty+
tree.view.getCellText(i, tree.columns.getNamedColumn("lastname"))+ empty+ "Contacts:");

var ggmail = tree.view.getCellText(i, tree.columns.getNamedColumn("gmail"));
var yyahoo = tree.view.getCellText(i, tree.columns.getNamedColumn("yahoo"));

  var existingEl  = document.getElementById('box');
  var capt   = document.createElement('groupbox');
  existingEl.appendChild(capt);
  var captionEl   = document.createElement('caption');
  capt.appendChild(captionEl);
  captionEl.setAttribute('label', contact );
  captionEl.setAttribute('style', 'color: blue;');


  var existing  = document.getElementById('box');
  var checkbox   = document.createElement('checkbox');
  capt.appendChild(checkbox);
  checkbox.setAttribute('label', ggmail );
  checkbox.setAttribute("checked", "false")
  checkbox.setAttribute('style', 'color: green;');

  var existing  = document.getElementById('box');
  var checkbox   = document.createElement('checkbox');
  capt.appendChild(checkbox);
  checkbox.setAttribute('label', yyahoo);
checkbox.setAttribute("checked", "false")
  checkbox.setAttribute('style', 'color: green;');

    }
  }
  return arr;

}