jQuery contextMenu inside filetree residing inside a jQuery frame

jQuery contextMenu inside filetree residing inside a jQuery frame

Hi,
         I have the following design:

index.html:

<script language="javascript"  src="/java_scripts/jqueryFileTree/jqueryFileTree.js"></script>
<link href="/java_scripts/jqueryContextMenu/jquery.contextMenu.css" rel="stylesheet" type="text/css" />
<script language="javascript"  src="/java_scripts/jqueryContextMenu/jquery.contextMenu.js"></script>

<script language="javascript"  src="/java_scripts/main.js"></script>

<frameset rows="20%, 5%, 25%, 5%, 20%, 25%" framespacing=no border="0" frameborder="0">
...
<frame name="filetreeFrame" id="filetreeFrame" src="/htmls/filetree.html" marginwidth="0" marginheight="0" scrolling=no onload="filetreeFrameLoad()">
...
</frameset>

filetree.html

    <div id="rightClickDiv">
        <ul id="rightClickMenu" class="contextMenu">
            <li class="new">
            <a href="#new">New</a>
            </li>
            <li class="edit">
            <a href="#edit">Edit</a>
            </li>
            <li class="cut separator">
            <a href="#cut">Cut</a>
            </li>
            <li class="copy">
            <a href="#copy">Copy</a>
            </li>
            <li class="paste">
            <a href="#paste">Paste</a>
            </li>
            <li class="delete">
            <a href="#delete">Delete</a>
            </li>
            <li class="quit separator">
            <a href="#quit">Quit</a>
            </li>
        </ul>
    </div>

<div id="filetreeDiv" class="listBoxStyle" style="margin-top:24px; margin-left:0px; width:22%; height:400px; padding:5px;"></div>


main.js:



        <script language="javascript">
            function filetreeFrameLoad()
            {
                      var filetreeLoc = top.frames["filetreeFrame"].document.getElementById('filetreeDiv');
                      $(filetreeLoc).fileTree({root: myFolder, script: myFn multiFolder: true}, function(file) {
                       $.ajax({ type: "GET",  
                          url: myFn,
                          data: 'fileName=' + file,      
                          async: false,
                          success : function(response)
                          {
                             $("textarea#answer").val(response);
                            fileSelected = file;
                            refreshFileTree();
                        }
                          });
                });
          
            $(filetreeLoc).contextMenu({
                  menu: 'rightClickMenu'
            },
            function(action, el, pos) {
                if (action == "new") {
                    var fileName = prompt("Please enter file name", "");
                    var filePath = pathName + myFolder + "/" + fileName;
                    $.ajax({ type: "POST",
                        url: myCrtFn,
                        data: {'filePath' : filePath},
                        success: function(response)
                        {
                            refreshFileTree();
                        }
                    });

                }
            });


            }

</script>



I am noticing that it is possible to load filetree jquery plugin from main.js, but it is not possible to load contextMenu plugin from the main.js file

Is there a way to invoke the contextMenu inside the frame which holds the jquery filetree?