JSFiddle - React, Tailwind, and code Playground

by clarkf

HTML

Interests:
<ul id='CBL1' class='checkboxlist'>
    <li><input type='checkbox' name='interest' value='javascript'> JavaScript</li>
    <li><input type='checkbox' name='interest' value='jquery'> jQuery</li>
</ul>
Hobbies
<ul id='CBL2' class='checkboxlist'>
    <li><input type='checkbox' name='hobby' value='horseriding'> Horseback riding</li>
    <li><input type='checkbox' name='hobby' value='lawnbowling'> Lawn bowling</li>
</ul>

<button onclick='validateCBLs();'>Go!</button>

JavaScript

function validateCBLs() {
    $lists = $('ul.checkboxlist');
    $lists.each(function(i, item) {
        if ($(item).find(':checked').length < 1) {
            //Show user an error, etc
            alert('Please, check at least one item from ' + $(item).attr('id'));
        }
    });
}