Checkbox'a tıklandığında popup açmak

Merabalar, Contact Form 7 kullanarak bir sayfada bulunan bir çok checkbox elemanına tıklandığında farklı içeriklerde popup açmak istiyorum.

Elemanlar bunlar olsun, her checkbox için farklı bir uyarı mesajı vermek istiyorum.

[checkbox test id: popup  use_label_element exclusive "Manuel Vites (Düz)"]
[checkbox test id: popup2  use_label_element exclusive "Manuel Vites (Düz)"]
[checkbox test id: popup3  use_label_element exclusive "Manuel Vites (Düz)"]

ancak bunu tekrar ettiremiyorum. kodu tekrar ettirdiğimde js kodları 2 farklı checkbox'ta çalışmıyor.

$(document).ready(function() {
    $('#popup').change(function() {
        $('#mycheckboxdiv').toggle();
         $('#overlay').toggle();
    });
});

<div id="mycheckboxdiv" style="display:none">
<div id="popup1" class="overlay">
    <div class="popup">
        <h2>Uyarı !</h2>
         <a id="kapat"><i class="fas fa-times"></i></a>
        <div class="content">
            İçerik     Alanı
        </div>
    </div>
</div>
</div>

#popup ile selector yerine checkbox'larda class kullanın örneği class='popup' selector'de #popup yerine .popup kullanın.

checkbox'ların id'leri ile popup1,popup2,popup3 .... mycheckboxdiv_popup1, mycheckboxdiv_popup2, mycheckboxdiv_popup3 yapın.

change function'da
let cid = this.id;
$('#mycheckboxdiv_'+cid).toggle(); gibi birşey kullanın

Merhaba,

Yazdım ben bu açıklamamdan daha anlaşılır herhalde.

https://jsfiddle.net/yeg4uotn/

<input type="checkbox" id="popup1" class="popupAc">
<input type="checkbox" id="popup2" class="popupAc">


<div id="mycheckboxdiv_popup1" style="display:none">
<div id="popup1" class="overlay">
<div class="popup">
<h2>Uyarı !</h2>
<a id="kapat"><i class="fas fa-times"></i></a>
<div class="content">
İçerik Alanı 11111111111
</div>
</div>
</div>
</div>

<div id="mycheckboxdiv_popup2" style="display:none">
<div id="popup1" class="overlay">
<div class="popup">
<h2>Uyarı !</h2>
<a id="kapat"><i class="fas fa-times"></i></a>
<div class="content">
İçerik Alanı 22222222222
</div>
</div>
</div>
</div>

$(document).ready(function() {
$('.popupAc').change(function() {
let cid=this.id;
$('#mycheckboxdiv_'+cid).toggle();

});
});