javascript - 如何使用 jQuery 删除伪内容后的元素

Question

我正在编写以下代码。如何使用 jQuery 删除 .house 点击事件后的伪内容？

$('.remove').on('click', function() {
  $('.house::after').css('display', 'none');
});

.house {
  position: absolute;
  right: 0px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 80px 80px 0;
  border-color: transparent red transparent transparent;
}

.house::after {
  position: absolute;
  content: "";
  width: 80px;
  height: 80px;
  background: url("http://i.imgur.com/nceI30v.png");
  background-repeat: no-repeat;
  background-position: 75% 40%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="house"></div>
<button class="remove">Remove Pseudo</button>

Answer 1

试试这个代码...

$('.remove').on('click', function() {
  $('.house').addClass('removing');
});

.house {
  position: absolute;
  right: 0px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 80px 80px 0;
  border-color: transparent red transparent transparent;
}

.house::after {
  position: absolute;
  content: "";
  width: 80px;
  height: 80px;
  background: url("http://i.imgur.com/nceI30v.png");
  background-repeat: no-repeat;
  background-position: 75% 40%;
}
.removing:after{
display:none
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="house"></div>
<button class="remove">Remove Pseudo</button>