css class嵌套

css 代码：

<style>
    .chose_bonus {
        font-size:9px;width:400px;border: 2px solid #dddddd;margin-top:5px;margin-bottom:5px;padding:9px;background:#ecf3fc; color:#FFF;
    }

    .chose_bonus.active{
　　//.chose_bonus .active{  之前是这么写的，不通，后换成上面的方式，就OK 了    
        background: #ecf3fc url(/ui/common/images/checked-blue.png) no-repeat right bottom;
        border: 2px solid #467cbd;

    }
</style>

JS代码：

<script type="text/javascript">
    $(\'.chose_bonus\').click(function(){
        if ($(this).hasClass("active")) {
            $(this).removeClass("active");
        }else{
            $(this).addClass("active");    
        }
    })
</script>

html代码：

            <tr class="bonus">
                <th width="120">可选红包</th>
                <td >
                <!--{loop $bonuslist[\'list\'] $key $bonus}-->
                <div class="chose_bonus" id="{$bonus[\'id\']}">
                    <span style="font-weight:bold;color:#000;">红包：</span><b style="color:#fbb450;">金额{$bonus[\'total_value\']}元 剩余：{$bonus[\'balance_value\']}元</b> <br/>
                    <span style="font-weight:bold;color:#000;">时效：</span><span style="color:#000;font-weight:bold;"> {$bonus[\'start_time\']}~{$bonus[\'end_time\']} </span><br/>
                    <span style="font-weight:bold;color:#000;">规则：</span><span style="color:#000;"> {$bonus[\'rule_value\']}</span>
                </div>
                <!--{/loop}-->
                </td>
            </tr>