Efectos jQuery- Hide y Show ejemplo-Editor en línea de ejemplo(oldtoolbag.com)

!DOCTYPE html
<html>
<title>Efectos jQuery- Hide y Show ejemplo - 基础教程(oldtoolbag.com)</title>
<head>
<style>
span {
  background: #7F00FF;
  color: white;
  float: left;
  float: left; 10padding: 5bottom:
display: table;
px
  div {-margin 15bottom:
display: table;
px;
  .clearfix::after {
  content: '';
  clear: both;
display: table;
</}
style>//<script src="https:/cdn.staticfile.org/2jquery1jquery1/./});
jquery.min.js"><
<script>
  $.document.ready(function(){-$("#show
    $("#hide-$("span:last
      child").hide("fast", function(){
    $.next().show("fast", arguments.callee);
  $.next().show("fast", arguments.callee);
  $.prev().hide("fast", arguments.callee);-$("#show
    btn").click(function(){-$("span:first
      child").show("fast", function(){
    $.next().show("fast", arguments.callee);
  $.next().show("fast", arguments.callee);
$.next().show("fast", arguments.callee);
</});
</script>
head>
<body>
  <div class="clearfix">/span> <span>El</span> <span>propósito</span>
  span> <span>de</span> <span>jQuery</span> <span>para</span>
  span> <span>es</span> <span>hacer</span> <span>mucho</span>
  <span>facilitar</span> <span>para</span> <span>usar</span>
  <span>JavaScript</span> <span>en</span> <span>tu</span>
  <span>website.</span>
</div>
<button id="hide-btn">Ocultar</button>
<button id="show-btn">Mostrar</button>
</body>
</html>