Css 重写jquery ui工具类

我试图覆盖jquery ui工具提示类，以便应用自定义类。使用knockout绑定到表中行的单元格中的范围。但是tooltipClass被忽略。知道为什么吗？Jquery-ui-1.10

    <div data-bind="visible:atleastOne">
        <table class="mytable">
            <thead>
                <tr>
                    <th colspan="1" class="white-back" />

                    <th class="border-bottom" colspan="5">Orders</th>
                </tr>
                <tr>
                    <th class="title-column border-right" />
                    <th class="value-column">Account</th>
                    <th class="value-column">Amount</th>
                    <th class="value-column">Day</th>
                    <th class="value-column">Percentage</th>
                    <th class="value-column">Date</th>

                </tr>
            </thead>
            <tbody data-bind="foreach: { data: items, as: 'item' }">
                <!-- ko if: $parent.hasMultiple -->
                <tr>
                    <tdborder-right" colspan="5">
                        <span class="bold" data-bind="text: 'Item ' + item.Code()"></span>
                    </td>
                    <td colspan="5"></td>
                </tr>
                <!-- /ko -->
                <!-- ko foreach: { data: item.childen, as: 'child' } -->
                <tr style="display: none;">
                    <td data-bind="attr:{ id: 'tooltip-content-' + item.code() + '-' + child.code() }">
                        <div data-bind="template: 'data-template', data: $data">
                        </div>
                    </td>
                </tr>
                <!-- ko foreach: { data: child.readOnly.subOrders, as: 'sub' } -->

                <tr class="child-row" data-bind="css: { alt: $parentContext.$index() % 2 }">
                    <td>
                        <span data-bind="visible: $index() == 0, text: item.readOnly.title, tooltip: {tooltipClass: 'test', show: true, content: '#tooltip-content-' + item.code() + '-' + child.code() }"></span>
                    </td>
                    <td>
                        <span data-bind="text: sub.readOnly.acc"></span>
                    </td>
                    <td class="numeric">
                        <span data-bind="text: sub.readOnly.amount"></span>
                    </td>
                    <td>
                        <span data-bind="text: sub.readOnly.day"></span>
                    </td>
                    <td class="numeric">
                        <span data-bind="text: sub.readOnly.percentage"></span>
                    </td>
                    <td>
                        <span data-bind="text: sub.readOnly.date"></span>
                    </td>
                </tr>
                <!-- /ko -->
                <!-- /ko -->
            </tbody>
        </table>
    </div>

如果将其添加到样式表中，则无论在何处按预期使用工具提示，样式都会被覆盖

.ui-tooltip
 {
     background:blue;
 }

但是，我需要在不同的工具提示上指定不同的样式，所以这对我不起作用

我试着瞄准桌子本身，但没有成功：

.mytable .ui-tooltip 
{
   background:pink;
}

---

您可以共享完整的html表吗？可能是在工具提示初始化之前添加了类，这意味着在工具提示初始化时它会被覆盖。@monotheist在完整的html表中添加html@RaduAndrei太好了，我该如何修复呢？请使用firebug检查元素跨度并将生成的innerHTML粘贴到这里。

.mytable .ui-tooltip 
{
   background:pink;
}