JSFiddle - React, Tailwind, and code Playground

HTML

<div id='mydiv'>
<button class='comment_action'>Comment</button >
</div>

CSS

#mydiv {
    background:#eeeeff;
    padding:10px;
}
.comment_action.disable,
.comment_action.disable:hover {
    opacity:0.5 !important;
     background:#fdd;
}

.comment_action:hover {
    opacity:1;
    background:#eee;
}

.comment_action {
    opacity:1;
    
}

JavaScript

//comment button index disable
$("#mydiv").toggle(function() {
    $(this).find(".comment_action").addClass('disable');
}, function() {
    $(this).find(".comment_action").removeClass('disable');
});