JSFiddle - React, Tailwind, and code Playground

by ysuper

HTML

<style>
  button {
    font-size: 20px;
    padding: 2px 2px 2px 2px;
    margin: 2px 2px 2px 2px;
  }

</style>

<div class="container">
  <hr>
  電子:<button>1</button><button>a</button><br>
  組裝:<button>2aa</button><button>b</button><br>
  機構:<button>3</button><button>c</button><br>
  軟體灌錯:<button>4</button><button>d</button><br>
  其它:<button>5</button><button>e</button><br>
</div>
<input type="button" class="button" value="MG無磁性">
<div class="container">
  <table width="100%" border="1">
     <tr>
      <td width="6%" align="center">電子</td>
      <td>
        <div id="type_1"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">機構</td>
      <td>
        <div id="type_2"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">組裝</td>
      <td>
        <div id="type_3"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">軟體灌錯</td>
      <td>
        <div id="type_4"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">其它</td>
      <td>
        <div id="type_5"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">原料</td>
      <td>
        <div id="type_6"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">設計</td>
      <td>
        <div id="type_7"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">組裝</td>
      <td>
        <div id="type_8"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">打件</td>
      <td>
        <div id="type_9"></div>
      </td>
    </tr>
     <tr>
      <td width="6%" align="center">其它</td>
      <td>
        <div id="type_10"></div>
      </td>
    </tr>
  </table>
</div>


<script>
  $('#type1').html("123")
</script>