JSFiddle - React, Tailwind, and code Playground

HTML

<div class="texti">
    <p>Hér getið þið valið ykkar egin álegg </p><h1>ATHUGIÐ</h1><p> bara tvö álegg!</p>
</div>
<br><br>
<div class="col-lg-2">
    <h4> Kjötálegg </h4>
    <form action="includes/pizzaprocess.php" method="POST" name="theform">
        <input type="checkbox" name="meat[]" value="1">Pepperoni  <br>
        <input type="checkbox" name="meat[]" value="2">Skinka  <br>
        <input type="checkbox" name="meat[]" value="3">Nautahakk  <br>
        <input type="checkbox" name="meat[]" value="4">Beikon  <br>
        <input type="checkbox" name="meat[]" value="5">Auka Pepperoni  <br>
        <input type="checkbox" name="meat[]" value="6">Kjúklingur  <br>

    <h4> Ostar </h4>
    <input type="checkbox" name="cheese[]" value="7">Gráðostur  <br>
    <input type="checkbox" name="cheese[]" value="8">Cheddarostur  <br>
    <input type="checkbox" name="cheese[]" value="9">Extra Ostur  <br>
    <input type="checkbox" name="cheese[]" value="10">Lítill Ostur  <br>
    <input type="checkbox" name="cheese[]" value="11">Enginn Ostur  <br>
    <input type="checkbox" name="cheese[]" value="12">Rjómaostur  <br>
    <input type="checkbox" name="cheese[]" value="13">Piparostur  <br>

    <h4> Grænt </h4>
    <input type="checkbox" name="greens[]" value="14">Græn Papripa<br>
    <input type="checkbox" name="greens[]" value="15">Laukur<br>
    <input type="checkbox" name="greens[]" value="16">Tómatsneiðar<br>
    <input type="checkbox" name="greens[]" value="17">Sveppir<br>
    <input type="checkbox" name="greens[]" value="18">Ananas<br>
    <input type="checkbox" name="greens[]" value="19">Jalapenos<br>
    <input type="checkbox" name="greens[]" value="20">Svartar Ólífur<br>
    <input type="checkbox" name="greens[]" value="21">Hvítlaukur<br>
    <input type="checkbox" name="greens[]" value="22">Rauðlaukur<br>
    <input type="checkbox" name="greens[]" value="23">Spínat<br>

    <input type="submit" />
    </form>
</div>

JavaScript

// your topping 'names' here
var groups = ['meat[]', 'cheese[]', 'greens[]'];

// for each group..
$.each(groups, function (idx, groupName) {

    // ..find all checkboxes inside
    var $group = $('.col-lg-2').find('input[name="' + groupName + '"]');

    // and catch click
    $group.click({group: $group}, function (event) {

        // on click event calculate sum of checked checkboxes
        var count = 0;
        $.each(event.data.group, function (idx, input) {
            count += (input.checked ? 1 : 0);

        }); // each input in group

        // warning the user
        if (count > 2) {
            alert('2 only!');
            event.preventDefault();
            return;
        }

    });

}); // each topping