title: jQuery dropdown and buttons changing disabled property for each pair
body: <p>I currently have two sets of drop down boxes with values in and a button next to it:
  <a href="https://i.stack.imgur.com/6gyyP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6gyyP.png" alt="Dropdown and button" /></a></p>
  <p>The drop down has a class of <strong>.select-tickets</strong>
  The add button has a class of <strong>.add-to-basket</strong></p>
  <p>If there is no value in the box I want the button to be disabled. (Upon page load all buttons are disabled).</p>
  <p>If there is a value in the box I want the button to be enabled.</p>
  <p>The jQuery code I am currently using is:</p>
  <pre><code>$(&quot;.select-tickets&quot;).change(function() {
            if (this.value &gt; 0) {
              $(this).parents().eq(3).find('.add-to-basket').prop(&quot;disabled&quot;, false);
            } else {
              $(this).parents().eq(3).find('.add-to-basket').prop(&quot;disabled&quot;, true);
            };  
   });
  </code></pre>
  <p>This works fine, however If I enter a value in the top dropdown box, both &quot;Add&quot; buttons become enabled and vice versa. I would like each pair to act individually from the other pairs of dropdown and button</p>
  <p>How do I make this code work on each individual set of dropdown and buttons (I would like to avoid adding an id or seperate class to each one as I may have end up with 20+ sets of dropdown boxes and buttons.</p>