Edit in JSFiddle

function runExample(demoUrl) {
    var fbRef = new Firebase(demoUrl);
    var groupsRef = fbRef.child('groups');
    var indexRef = fbRef.child('users/mchen/groups');
    
    /******************
     Monitor the index
     for add/remove events
     ******************/
    indexRef.on('child_added', added);
    indexRef.on('child_removed', removed);

    function added(idxSnap, prevId) {
        // when an item is added to the index, fetch the data
        groupsRef.child(idxSnap.key()).once('value', function (dataSnap) {
            addToList(dataSnap.key(), dataSnap.val(), prevId);
        });
    }

    function removed(snap) {
        dropFromList(snap.key());
    }
    
    /**********************
     Add and remove items from
     the index when group buttons
     are pressed
     **********************/

    // catch button clicks and trigger add/remove
    watchForButtonClicks(addToIndex, dropFromIndex);
    
    function addToIndex(id) {
        indexRef.child(id).set(true);
    }
    
    function dropFromIndex(id) {
        indexRef.child(id).remove();
    }
    
    /**************************
     Demo fluff to build the UI
     and make it semi-pretty
     **************************/
    var indexGroups = {};
    indexRef.on('value', update);

    function watchForButtonClicks(add, remove) {
        $('ul.index button').click(function() {
           var myId = $(this).closest('li').attr('data-id');
            if( !indexGroups.hasOwnProperty(myId) ) {
                add(myId);   
            }
            else {
                remove(myId);
            }
        });   
    }
    
    function addToList(key, data, prevId) {
       $prev = getPrevItem(prevId);
       var $item = $('<li></li>')
           .text(data.name)
           .attr('data-id',key);
        if( $prev ) {
           $item.insertAfter($prev);   
        }
        else {
           $item.prependTo('ul.groups');   
        }
        return $item;   
    }
    
    function dropFromList(key) {
       $('ul.groups').find('li[data-id="'+key+'"]').remove();
    }
    
    function getPrevItem(prevId) {
        if( prevId !== null ) {
           return $('ul.groups').find('li[data-id="'+prevId+'"]');   
        }
    }
    
    function update(snap) {
        indexGroups = snap.val()||{};
        log(snap);
        $('ul.index li').each(function() {
            var myId = $(this).attr('data-id');
            var hasGroup = indexGroups.hasOwnProperty(myId);
            $(this).find('button').text(hasGroup? 'delete' : 'add');
        });
    }

    function log(snap) {
        $('pre').text(JSON.stringify(snap.val(), null, 2));
    }
}

// Dependencies used in this fiddle:
// code.jquery.com/jquery-2.1.0.min.js
// cdn-gh.firebase.com/demo-utils-script/demo-utils.js
//
// This line creates a unique, private Firebase URL 
// you can hack in! Have fun!
$.loadDemo('web/org', 'org/index-example').then(runExample);