An implementation of SimpleTree
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery-simpleTreeMenu-1.1.0.js"></script>
<script>
$(document).ready(function() {
var x=0;
var u=0;
var ulidp="";
var ulidc="";
$.get('codes.xml', function(d){
$(d).find('record').each(function(){
var $record = $(this);
var parent_flag = $record.find('parent_flag').text();
var parent_id = $record.find('parent_id').text();
var code = $record.find('code').text();
var depth = $record.find('depth').text();
var code_level = $record.find('code_level').text();
var id = $record.find('id').text();
if (x==0) {
ulidc = 'ul' + id
$('#myMenuTree').append('<li class="Node expandable" id="reasonForLeaving|'+id+'">' + code + '<ul id="' + ulidc + '">');
x++;
} else {
if (parent_flag =="Y") {
ulidp = 'ul' + parent_id;
ulidc = 'ul' + id
$("#" + ulidp).append('<li class="Node expandable" id="reasonForLeaving|'+id+'">' + code + '<ul id="' + ulidc + '">');
} else {
ulidp = 'ul' + parent_id;
$("#" + ulidp).append('<li class="Node selectable" id="reasonForLeaving|'+id + '" >' + code + '</li>');
}
}
});
});
x=0;
$('#myMenuTree').simpleTreeMenu();
$('#expand').click(function(){
$('#myMenuTree').simpleTreeMenu('expandAll');
});
$('#close').click(function(){
$('#myMenuTree').simpleTreeMenu('closeAll');
});
$('.selectable').live("click", function(){
alert("Selected");
});
});
</script>
</head>
<body>
<div id="wrapper">
<br />
<span id="expand">expand all</span>
<span id="close">close all</span>
<ul id="myMenuTree" class="myTree" >
</ul>
</div>
</body>
</html>