bubble

e.target;           //유저가 실제로 누른거
e.currentTarget;    //이벤트리스너 달린 곳
e.preventDefault();   //기본동작막기
e.stopPropagation();  //body같은 상위요소 버블링 막기

 

function tapshow(i) {
  $(".tab-button").removeClass("orange");
  $(".tab-button").eq(i).addClass("orange");
  $(".tab-content").removeClass("show");
  $(".tab-content").eq(i).addClass("show");
}
$(".list").click(function (e) {
  tapshow(e.target.dataset.id);
});

<ul class="list">
  <li class="tab-button" data-id="0">Products</li>
  <li class="tab-button orange" data-id="1">Information</li>
  <li class="tab-button" data-id="2">Shipping</li>
</ul>
<div class="tab-content">
  <p>상품설명입니다. Product</p>
</div>
<div class="tab-content show">
  <p>버블링</p>
</div>
<div class="tab-content">
  <p>배송정보입니다. Shipping</p>
</div>