Function works 1st time, but not 2nd time, throws error

Hi,

I have a function that gets called via an onclick event, code snippet:  onclick="opt.transferRight().

This functions transfers values from 1 multi select box to another multi select box

It works perfectly until I make this ajax call that is tied to an onchange event on a drop down menu.  The ajax works fine and basically loads another select based on a choice in the first, this works fine, but when I try to click the button again with the  code snippet:  onclick="opt.transferRight().  I get an error shown below:  The page has not refreshed or anything.  The function should be defined, but its not

I am using Firefox.

---------------
Error Message:
opt.transferRight is not a function
----------------

Here is what gets called via an onchange on my select box, its an ajax call to my server side object.

function getOffices(companyId) {
            var params = new Object();
            params.companyId = companyId;
            http('POST', 'com/SomeServerSideObject.cfc?method=getOffices', cbOfficeHandler, params);
      }
      
      function cbOfficeHandler(obj) {
            clearSelect( $('officeId') );
            addOptions( $('officeId'),obj )
            
      }

The above code works everytime, its just when its called, for some reason it causes my other function to break and I get the error I listed above.


This is in the top of the page and gets called for every page request, its not called via a function

<script type="text/javascript">
      var opt = new OptionTransfer("userId","assignedId");
      opt.setAutoSort(true);
      opt.setDelimiter(",");
      opt.saveAddedRightOptions("addedRight");
      opt.saveNewRightOptions("newRight");
      opt.saveAddedLeftOptions("addedLeft")
</script>


Any ideas?

-ws