JSFiddle - React, Tailwind, and code Playground

by dktky20

HTML

<script src="jquery.quicksearch.js"></script>
<form action="#">
  <input type="text" name="search" value="" id="search" />
</form>
<table>
  <thead>
    <tr>
      <th>氏名</th>
      <th>教科</th>
      <th>点数</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>阿良々木</td>
      <td>数学</td>
      <td>100</td>
    </tr>
    <tr>
      <td>戦場ヶ原</td>
      <td>英語</td>
      <td>100</td>
    </tr>
    <tr>
      <td>羽川</td>
      <td>国語</td>
      <td>100</td>
    </tr>
    <tr>
      <td>忍野</td>
      <td>化学</td>
      <td>60</td>
    </tr>
    <tr>
      <td>八九寺</td>
      <td>生活</td>
      <td>100</td>
    </tr>
    <tr>
      <td>神原</td>
      <td>保健体育</td>
      <td>90</td>
    </tr>
    <tr>
      <td>千石</td>
      <td>暦</td>
      <td>100</td>
    </tr>
    <tr>
      <td>貝木</td>
      <td>社会</td>
      <td>70</td>
    </tr>
    <tr>
      <td>斧乃木</td>
      <td>日本史</td>
      <td>50</td>
    </tr>
    <tr>
      <td>影縫</td>
      <td>数学</td>
      <td>70</td>
    </tr>
  </tbody>
</table>

JavaScript

$(function() {
  $('input#search').quicksearch('table tbody tr');
});