使用箭头键删除div

Question

我有五个问题，并且每个问题都隐藏在编号为1-5的框中，一旦用户从1 - 5中选择一个数字，所选框将弹出问题.. 我想知道如何删除选定框，如果用户按下右键，如果左键会做什么，但弹出一个大X标记..

<script type="text/javascript"> 
      function Question1(){ 
      document.getElementById('Question').innerHTML = 'Question#1'; 
      } 
      function Question2(){ 
      document.getElementById('Question').innerHTML = 'Question#2'; 
      } 
      function Question3(){ 
      document.getElementById('Question').innerHTML = 'Question#3'; 
      } 
      function Question4(){ 
      document.getElementById('Question').innerHTML = 'Question#4'; 
      } 
      function Question5(){ 
      document.getElementById('Question').innerHTML = 'Question#5'; 
      } 

      function showArrowKey(e) { 
      arrowKey = e.which||e.keyCode; 
      switch(arrowKey) { 
       case 37: //left key 
        //Do nothing just pop up Big X mark 
        break; 
       case 39: //right key 
        // Remove the selected div, and pop up Check mark 
        break; 
      } 
     } 

    </script> 
<div class = "container"> 
     <div id = "CompleteImage"> 
      <div class = "squareInside" id="trigger-overlay1" onclick='Question1()'>1</div> 
      <div class = "squareInside" id="trigger-overlay2" onclick='Question2()'>2</div> 
      <div class = "squareInside2" id="trigger-overlay3"onclick='Question3()'>3</div> 
      <div class = "squareInside2" id="trigger-overlay4"onclick='Question4()'>4</div> 
      <div class = "squareInside2" id="trigger-overlay5"onclick='Question5()'>5</div> 

     </div> 
    </div> <!-- container --> 
    <div class="overlay overlay-door" > 
     <button type="button" class="overlay-close">Close</button> 
     <nav> 
      <ul> 
       <li><p id='Question' ></p></li> 
      </ul> 
     </nav> 
    </div> 

Answer 1

使用jQuery，删除一个元素，在这种情况下一个div，使用：

$('div').remove(); 

然后显示复选标记，将其作为另一个元素pr可靠地低于与CSS的div：display:none; 然后随着删除的div，用jQuery再次揭示它

$('checkMark').show();