change image color when reveal content

jQuery(function($){
    var revealButtons = {
        '.rv_button_1-do': '.rv_element_1-do'
    
 
    };
    $.each(revealButtons, function(revealButton, revealElement) {
        $(revealButton).click(function(e){
            e.preventDefault();
            $(revealElement).slideToggle();
            $(revealButton).toggleClass('rotateicon img-color');
        });
    });
});

body:not(.et-fb) .rv_element-do { display: none; }
.img-color {
filter: grayscale(100%);
}
.rv_button_1-do{
background-color: blue; 
padding: 12px 20px; 
color: white;
width: 200px;
text-align: center; 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img decoding="async" loading="lazy" src="https://media.npr.org/assets/img/2017/01/18/red-turtle_wide-03029731def2957b2fb69fb27e44c5c2e456f4a6-s800-c85.webp" width="80" height="165" alt="" class="img-color">
<p>Example text</p>
<div class="rv_element-do rv_element_1-do">                                         
    <p>Helps to fund ten (10) Estuary pop-up outreach events, or one (1) water-quality testing location kit for an entire year, or a day of seagrass monitoring in the field. Included with this donation:</p></div>
 
 <div class="rv_button_1-do"><a>button reveal</a></div>