샘플 html #1

li tag 의 클래스 명이 'second' 인 것만 제외 하고 css 적용시키는 예

<div id="test-code-1">
    <ul class="ui list">
        <li class="first">Gaining Access</li>
        <li class="second">Inviting Friends</li>
        <li class="third">Benefits</li>
        <li class="fourth">Warranty</li>
    </ul>
</div>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
var $except = $('#test-code').find('ul>li.second');
$('#test-code-1').find('ul>li').not($except).css({
    'color': 'orange',
    'font-weight': 'bold'
});
</script>

Demo

  • Gaining Access
  • Inviting Friends
  • Benefits
  • Warranty

샘플 html #2

li tag 중 클릭한 li tag와 클릭하지 않는 li tag 에 다른 css 적용시키는 예

<div id="test-code-2">
    <ul class="ui list">
        <li class="first">Gaining Access</li>
        <li class="second">Inviting Friends</li>
        <li class="third">Benefits</li>
        <li class="fourth">Warranty</li>
    </ul>
</div>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$('#test-code-2').find('ul>li').bind('click', function () {
    $except = $(this);
    $except.css({
        'color': '#555',
        'font-weight': 'normal'
    });
    $('#test-code').find('ul>li').not($except).css({
        'color': 'orange',
        'font-weight': 'bold'
    }); 
});
</script>

Demo

  • Gaining Access
  • Inviting Friends
  • Benefits
  • Warranty