Two groups of Buttons but with same class name
If you must use jQuery, then the simplest way by far is to wrap each section in a div :

&lt;div class="section"&gt;
    &lt;h2&gt;Park One&lt;/h2&gt;
    &lt;button class="updateStatus" value="complete"&gt;Complete&lt;/button&gt;
    &lt;button class="updateStatus" value="on hold"&gt;On Hold&lt;/button&gt;
&lt;/div&gt;

&lt;div class="section"&gt;
    &lt;h2&gt;Park Two&lt;/h2&gt;
    &lt;button class="updateStatus" value="complete"&gt;Complete&lt;/button&gt;
    &lt;button class="updateStatus" value="on hold"&gt;On Hold&lt;/button&gt;
&lt;/div&gt;


This allows you to use .siblings("button") to select the clicked button's counterpart :

$(".updateStatus").click(function () {
    $(this)
        .addClass(($(this).val() === "complete") ? 'green' : 'orange')
        .siblings("button").removeClass("green orange");
});


The .each() loop vanishes.

It's very common to use divs or spans like this, to give your DOM structure. 

Updated fiddle