JSFiddle - React, Tailwind, and code Playground

HTML

<form action="http://localhost/settings/1/mail" method='post' id='formID2'><div><input type='hidden' name='st' value='k'/><div id='strikeIt'><ul><li><input type="checkbox" name="mailRemove[]" id="andypsv@path-of-power.com" value="andypsv@path-of-power.com"/> <span class='b'>andypsv@path-of-power.com</span>(primary address)                            </li><li><input type="checkbox" name="mailRemove[]" id="s1@a.pl" value="s1@a.pl"/> <span class='b'>s1@a.pl</span><label for="s1@a.pl" class='a'><span class="remove pointer low" style='margin-left:4px'>Remove</span><span class="undo">Undo</span></label>                             </li><li><input type="checkbox" name="mailRemove[]" id="s2@a.pl" value="s2@a.pl"/> <span class='b'>s2@a.pl</span><label for="s2@a.pl" class='a'><span class="remove pointer low" style='margin-left:4px'>Remove</span><span class="undo">Undo</span></label>                             </li><li><input type="checkbox" name="mailRemove[]" id="s3@a.pl" value="s3@a.pl"/> <span class='b'>s3@a.pl</span><label for="s3@a.pl" class='a'><span class="remove pointer low" style='margin-left:4px'>Remove</span><span class="undo">Undo</span></label>                             </li></ul></div><div id='hideAddNewEmail'><div class='hr1' style='width:450px;margin-top:-10px'>&nbsp;</div><div><a id='_add_new_mail' class='pointer'>Add new email</a></div><div id='add_new_mail' class='noprint'><dl><dt><label for='mail'><span class='dk'>New Email</span></label></dt><dd><span class='itext'><input type='text' name='mail' id='mail' class='itip s1' value=''/></span></dd></dl>                        </div></div><div class='f'>&nbsp;</div><div class='hr1' style='width:450px;margin-top:-10px'>&nbsp;</div><div class='low b'>In order to save changes, please enter your current password.</div><div style='margin-top:6px'><dl><dt><label for='pass' class='dk'>Password</label></dt><dd><span class='itext'><input type='password' name='pass' id='pass' style='width:200px' value=''...

CSS

#strikeIt li > input ~ label {cursor: pointer;}
#strikeIt li > input ~ label > .undo { display: none; }
#strikeIt li > input:checked ~ label > .undo { display: inline; }
#strikeIt li > input:checked ~ label > .remove { display: none; }
#strikeIt li > input + span {padding-right: 10px;cursor: default;}
#strikeIt li > input.checked + span {text-decoration: line-through; color: gray;}
#strikeIt li > input { display: none; }
.noprint{display:none}

JavaScript

jQuery(function($) {
                        $('#_add_new_mail').click(function() {
                            $('#_add_new_mail').hide();
                            $('#add_new_mail').show(); $('#mail').focus();
                        });

                        $('.remove').click(function() {
                            $('#hideAddNewEmail').hide();
                        });

                        $('.undo').click(function() {
                            $('#hideAddNewEmail').show();
                        });
                    });

                    jQuery(function ($) {
                        $("li > :checkbox").change(function () {
                            $(this).toggleClass("checked", this.checked);
                        });
                    });