[keep] select all except this

by M. Mahbubur Rahman

HTML

<div class="wrap">
    <button data-show-link>toggle</button>
    <p data-show-id>I shouldn't get opacity</p>
    <p>We want to get opacity on toggle.</p>
    <p>We want to get opacity on toggle.</p>
    <p>We want to get opacity on toggle.</p>
    <p>We want to get opacity on toggle.</p>
    <p>We want to get opacity on toggle.</p>
</div>

CSS

[data-show-id] {
    display: none;
    color: red;
    border: dotted 1px red;
}

.wrap {
    background-color: green;
}

.get-opacity {
    opacity: 0.2;
}

p {
    width: 250px;
    padding: 10px;
}
}

JavaScript

$(document).on('click', '[data-show-link]', function() {
    var $this = $(this);
    
    $('[data-show-id]').toggle();    
    $("p").not("[data-show-id]").toggleClass('get-opacity');
    event.preventDefault();
});