title: Next JS Button show on checked checkbox
body: <p>I have simpple code below. my goals is, if checkbox checked then button can click..
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;button
  className={`btn btn-xl text-6xl ${isChecked[0] == true? "bg-primary" : "bg-gray-700/20"} w-full h-12 my-4 font-semibold text-white ${isChecked[0] == true ? "" : "pointer-events-none"}`}&gt;
  Checkout
  &lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><a href="https://i.stack.imgur.com/yE1SD.png" rel="nofollow noreferrer">i have 2 value of checkbox</a></p>
  <p>my problem is the button only check first index because i set isChecked[0]..
  i have try to mapping the isChecked but button doesn't show..</p>
  <p>how to check index of isChecked dynamically ?</p>