Quick and Dirty CYOA Rewrite

//this line creates a new object called "purchases"
purchases = {};
//purchases will keep track of tableName and rowNum values

//we create a variable for points, instead of making
//temporary ones every time we need them
points = 100;

//we call this after we've changed the points total, to keep te counter
//up to date
function refreshCounter() {
    document.getElementById("counter").innerHTML = points.toString();
}

//this is a new function, since with the current design we need to find the row a lot
function getRow(tableName, rowNum) {
    return document.getElementById(tableName).getElementsByTagName("tr")[rowNum];
}

//getCost and getBonus were both identical except for the class name we wanted
//now they're much simpler; most of the common functionality is in getCellData
function getCellData(row, className) {
    //a try { <A> } catch(error) { <B> } block basically means
    //"do <A>, but if something goes wrong there do <B>"
    try
    {
        //we got rid of the loop by using the built-in html function
        //getElementsByClassName
        return row.getElementsByClassName(className)[0].innerHTML;
    }
    catch(error)
    {
        return undefined;
    }
}

function getCost(row) {
    return parseInt(getCellData(row, "cost_col")) || 0;
}

function getBonus(row) {
    return parseInt(getCellData(row, "bonus_col")) || 0;
}

function buy(tableName, rowNum, method, noclear) {
    var row = getRow(tableName, rowNum);
    var cost = getCost(row);
    var bonus = getBonus(row);

    if(points >= cost) {
        //used to be "noclear != 1", but this is much
        //simpler and means the same thing in this case
        if(!noclear) {
            //we pass no argument to refund so that it refunds every match
            refund(tableName);
        }

        //purchase option
        if(method == "roll") {
            row.className = "rolled";
            points += bonus; //"x += y" is a shorthand for "x = x + y"
        } else {
            if(tableName == "artifact") {
                points += bonus; //"x += y" is a shorthand for "x = x + y"
            }
            row.className = "purchased";
        }
        points -= cost; //"x -= y" is a shorthand for "x = x - y"

        //get the existing set or make a new one
        var rowSet = purchases[tableName] || {};
        //add our rowNum to it
        rowSet[rowNum] = true;
        //update our purchases with the new set
        purchases[tableName] = rowSet;
    }

    refreshCounter();
}

function refund(tableName, rowNum) {
    var refundRow = function(rowNum) {
            var row = getRow(tableName, rowNum);
            row.className = "";
            points += getCost(row);
        };

    var rowSet = purchases[tableName];
    if(typeof rowSet === "undefined") {
        //no need to refund, since it isn't even purchased
        return;
    }

    if(typeof rowNum === "undefined") {
        //we need to refund the whole table

        //iterate over all the rowNums
        var rowNums = Object.keys(rowSet);
        for (var i=0; i<rowNums.length; i++) {
            refundRow(rowNums[i]);
        }

        //remove the tableName from purchases
        delete purchases[tableName];
    }
    else
    {
        refundRow(rowNum);
        delete rowSet[rowNum];
    }
    refreshCounter();
}

function slidePanel(id) {
    var panel = document.getElementById(id);
    if(panel.className == "infocus") {
        panel.className = "nodisplay";
    } else {
        panel.className = "infocus";
    }
}

function roll(dice, sides) {
    var total = 0;
    for (var i=0; i<dice; i++) {
        total = total + Math.floor(Math.random()*sides)+1;
    }
    return total;
}

function roll_choice(tableName) {
    var confirmed = window.confirm("Are you sure you want to take a random option? This may not be reversible.");
    if(confirmed === true) {
        var choice = roll(1,0) - 1;
        //changed the 1 for the noclear argument to true
        //which is better than 1 when all you want is true or false
        buy(tableName,choice,"roll",true);
    }
}

//this function is radically different from the original version
//hopefully doesn't have the bug where things don't get removed properly
//it may look more complex, but (apart from the sort) it's actually really simple
function gen_summary() {
    //this gives us an array containing all the tableName entries (in a random order)
    var tableNames = Object.keys(purchases);

    //this will hold our temporary objects
    var allPurchased = [];

    //we iterate over our tableNames
    for (var i=0; i<tableNames.length; i++) {
        var tableName = tableNames[i];
        var rowSet = purchases[tableName];

        var rowNums = Object.keys(rowSet);
        for (var j=0; j<rowNums.length; j++) {
            var rowNum = rowNums[j];
            var row = getRow(tableName, rowNum);

            var name = getCellData(row, "name_col");
            var cost = getCost(row);
            var className = row.className;

            var bonus = 0;
            if(className == "rolled") {
                bonus = getBonus(row);
            }

            var obj = { name:name, cost:cost, className:className, bonus:bonus };
            allPurchased.push(obj);
        }
    }

    //this is tricky, so don't worry if you don't get it yet
    //we're defining a new function with a different syntax
    //this one is called tableNameCompare and it is only visible
    //inside this function (see the "var" on the left)
    //we use it later to sort our output so that the cheapest
    //purchases come first (bonuses subtracted from costs),
    //alphabetically otherwise
    var tableNameCompare = function(a, b) {
            aCost = a.cost - a.bonus;
            bCost = b.cost - b.bonus;
            costDifference = aCost - bCost;
            if(costDifference == 0) {
                //they have the same price, so go alphabetically

                //make sure they both have the same case, otherwise
                //javascript puts capitals first
                aSortName = a.name.toUpperCase();
                bSortName = b.name.toUpperCase();

                //this is like the "costDifference" line above but for strings
                return aSortName.localeCompare(bSortName);
            }
            return costDifference;
        };

    //now we sort of names by increasing cost and alphabetically
    allPurchased.sort(tableNameCompare);

    //setup our variables for the summary
    var baubles = 100;
    var baubleString, prefixString, nameString, fullString;

    //create an empty array to hold our strings
    var outStrings = [];

    //loop over our tableNames again, this time in sorted order
    for (var i=0; i<allPurchased.length; i++) {
        //get back tableName, rowNum, and row
        var purchased = allPurchased[i];

        //update bauble count in one go
        baubles += purchased.bonus - purchased.cost;
        baubleString = "[" + baubles + "]";

        //setup prefixString
        if(purchased.className == "rolled") {
            prefixString = " Rolled: ";
        } else {
           prefixString = " ";
        }

        //combine the substrings we made earlier
        //it's very easy to tell what each part does now
        //by looking at where we defined each variable
        //baubleString is "[<baubles>]"
        //prefixString is either " Rolled: " or " "
        //nameString is just "<name>"
        fullString = baubleString + prefixString + purchased.name;

        //now we put our string at the end of the array we made
        outStrings.push(fullString);
    }

    //this turns our array of strings into one big string, putting
    //"<br>\n" in between all of the smaller strings
    //the "<br>" is the HTML break tag
    //"\n" means "new line", which makes it so it isn't just one
    //big clump of HTML
    var result = outStrings.join("<br>\n");
    document.getElementById("p_summary").innerHTML = result;
}

function is_taken(tableName, rowNum) {
    //new function means we don't have to mess with the DOM at all
    //in fact this function never even gets called now
    return purchases[tableName][rowNum] !== undefined;
}