JSFiddle - React, Tailwind, and code Playground

HTML

<div class="organizer_listing">

    <div class="organizer_listing_checkbox_container_container">
        <div class="organizer_listing_checkbox_container" data-listing_id=1234>
            <input type="checkbox" class="organizer_listing_checkbox" />
        </div>
    </div>

</div>
Different colours for demo.

JavaScript

// Click checkbox when its container is clicked
$('.organizer_listing').on('click', '.organizer_listing_checkbox_container_container', function(event) {
    if ($(event.target).hasClass('organizer_listing_checkbox')) {
        return; // Don't do anything
    }
    $(':checkbox', this).each(function(){
        this.checked = !this.checked; //Swap check state
    }).trigger('change');
}).on('change', '.organizer_listing_checkbox', function(event) {
    var $this = $(this),
        $main_listing = $this.closest('.organizer_listing');
    if (this.checked) {
        $main_listing.css('background-color', "red");
    } else {
        $main_listing.css('background-color', "yellow");
    }
});

// Highlight row on selecting Checkbox