Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
  <head>
    <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
    <meta charset="utf-8">
    <title>JS Bin</title>
  </head>
  <body>
    <img id="imga" src="http://www.placekitten.com/100/100" />
    <img id="imgb" src="http://www.placekitten.com/100/100" />
    <img id="imgc" src="http://www.placekitten.com/100/100" />
    <div id="show">
      <p class="invisible" id="showa">AAA</p>
      <p class="invisible" id="showb">BBB</p>
      <p class="invisible" id="showc">CCC</p>
    </div>
  </body>
</html>
 
.invisible{
  visibility:hidden;
}
 
$(document).ready(function() {
  
  $('[id^=img]').click(function() {
      var $target = $("#show"+ this.id.split("img")[1])
      $("[id^=show]").not( $target ).addClass("invisible");
      $target.toggleClass("invisible");
  });
  
});
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
roXonpro
0viewers