sample: table row filtering with jQuery

by sii_side

HTML

<table class="tbl_zaiko">
  <tbody>
    <tr id="zaiko01" zaikoid="01">
      <th>商品名</th>
      <th>単価</th>
      <th>個数</th>
    </tr>
    <tr id="zaiko02" zaikoid="02">
      <td>えんぴつ</td>
      <td><span class="zaiko_price" value="100">100</span>円</td>
      <td>
        <input type="text" id="oder_zaiko02" class="zaikoid[]" name="zaikoid[02]" value="0">
      </td>
    </tr>
    <tr id="zaiko03" zaikoid="03">
      <td>消しゴム</td>
      <td><span class="zaiko_price" value="150">150</span>円</td>
      <td>
        <input type="text" id="oder_zaiko03" class="zaikoid[]" name="zaikoid[03]" value="0">
      </td>
    </tr>
    <tr id="zaiko04" zaikoid="04">
      <td style=>ノート</td>
      <td style=><span class="zaiko_price" value="300">300</span>円</td>
      <td style=>
        <input type="text" id="oder_zaiko04" class="zaikoid[]" name="zaikoid[04]" value="0">
      </td>
    </tr>
    <tr id="zaiko05" zaikoid="05">
      <td style=>筆ペン</td>
      <td style=><span class="zaiko_price" value="800">800</span>円</td>
      <td style=>
        <input type="text" id="oder_zaiko05" class="zaikoid[]" name="zaikoid[05]" value="0">
      </td>
    </tr>
  </tbody>
</table>

<input id="ichiran" type="button" value="Push" />

<div class="zaikoCheck"></div>

JavaScript

$("#ichiran").on("click", function() {
  $(".zaikoCheck").empty();

	//$.filterで必要なものを振り分ける
  $("tr").each(function() {
  	if ($(this).find("input").val() > 0) {
      var pName = $(this).find("td").eq(0).text();
      var pNum  = $(this).find("input").val();
      $(".zaikoCheck").append("<p>" + pName + " × " + pNum + "個</p>");
		}
  });
});