title: Cancel button HTML jQuery
body: <p>Hi I am stuck with my current work because of this cancel button issue.</p>
  
  <p>Here I will explain my problems with some screen shorts
  <img src="https://i.stack.imgur.com/IeWek.jpg" alt="enter image description here"></p>
  
  <p>This is my first page when iam click to the the first radio button[Unique] it goes to this</p>
  
  <p><img src="https://i.stack.imgur.com/Od40m.jpg" alt="enter image description here"></p>
  
  <p>Here I want when I click cancel button it goes back to first screen short but when I click it does like dis</p>
  
  <p><img src="https://i.stack.imgur.com/PCIcI.jpg" alt="enter image description here">
  This is ma full code</p>
  
  <pre><code>   &lt;head&gt;
    &lt;meta charset="utf-8" /&gt;
  
  &lt;link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-
   ui.css" /&gt;
  &lt;script src="http://code.jquery.com/jquery-1.9.1.js"&gt;&lt;/script&gt;
   &lt;script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"&gt;&lt;/script&gt;
   &lt;style&gt;
       .raddiv{
          height: 30px;        
       }
      .sitehtn{
       display: none
              }        
  
      .container       
       {
      width: 100%;
      height: 600px;
      background-color: rgb(179, 174, 174);        
       }
  
      #datepickerT
      {
      margin-left: 2em;
      }
  
      .eventDateDiv
      {
      height: 150px;
      width: 65%;
      margin-left: auto;
      margin-right: auto;
      }
      #daysBetween
      {
      margin-top: -1.4em;
      margin-left: 30%;
      }
      .eventShowDiv
      {
      height: 306px;
       width: 65%;
      margin-left: auto;
      margin-right: auto;
  
      }
      .event{
      color: green;
      margin-top: 5px;}
    &lt;/style&gt;
     &lt;script&gt;
            $(function() {
          $( "#datepickerF" ).datepicker({
              showOn: "button",
             buttonImage: "calendar.gif",
            buttonImageOnly: true
          });
  
     $( "#datepickerT" ).datepicker({
                showOn: "button",
              buttonImageOnly: true
           });
  $('#getdays').click(function() {
       var start = $('#datepickerF').datepicker('getDate');
         var end   = $('#datepickerT').datepicker('getDate');
        var days   = (end - start)/1000/60/60/24;
        document.getElementById("daysBetween").innerText=days;
  
             });
  
      $(".radioBtn").click(function() {
      $(".textBox").hide();
      if ($(this).attr("id") == "courtierRadio") {
      $("#faderad").fadeOut();
     var is= $("#txt1, #txt2,#txt3,#getmrr,#rmvmrr")
     is.show();
  
      } else if ($(this).attr("id") == "agenceRadio") {
           $("#fadfirst").fadeOut();
       var vs=$("#txt5,#txt6,#txt7,#txt8").show();
       vs.show();
      }   
  
      });
         $("#getmrr").click(function() {
        $('#mytable tbody&gt;tr:last').clone(true).insertAfter('#mytable tbody&gt;tr:last');
        return false;
  
      });
      $("#rmvmrr").click(function() {
  
        $("#mytable").remove();
  
        return false;
  
      });
        function myFunction()
         {
         $("#getmrr").append(is);
          }
        });
  
        &lt;/script&gt;
                &lt;/head&gt;
         &lt;body&gt;
       &lt;div class="container"&gt;
  
          &lt;div class="eventDateDiv"&gt;
              &lt;div class="event"&gt;
                  EVENT DATE
              &lt;/div&gt;
  
              &lt;p&gt;FROM: &lt;input type="text" id="datepickerF" /&gt;&lt;/p&gt;
              &lt;p&gt;To: &lt;input type="text" id="datepickerT" /&gt;&lt;/p&gt;
  
  
              &lt;button id="getdays"&gt;NO.OF DAYS &lt;/button&gt;
              &lt;p id="daysBetween"&gt; &lt;/p&gt;
  
          &lt;/div&gt; 
          &lt;div class="eventShowDiv"&gt;
              &lt;div class="event"&gt;
                  EVENT SHOW TIME
              &lt;/div&gt;
              &lt;p&gt;TYPE OF SHOW: &lt;/p&gt;
       &lt;div id="fadfirst" class="raddiv"&gt;         
                 &lt;label&gt;
        &lt;input type="radio" name="sitewebGroup" value="Courtier" id="courtierRadio" 
      class="radioBtn" /&gt;Unique
     &lt;/label&gt;
        &lt;table id="mytable" width="500" &gt;
     &lt;tbody&gt;
     &lt;tr&gt;
  &lt;td&gt;
       &lt;input type="text" name="site" class="sitehtn" id="txt1" /&gt;
       &lt;input type="text" name="site" class="sitehtn" id="txt2" /&gt;
        &lt;input type="text" name="site" class="sitehtn" id="txt3" /&gt;
    &lt;/td&gt;
       &lt;/tr&gt;
    &lt;/tbody&gt;
        &lt;/table&gt;
         &lt;button id="getmrr" class="sitehtn" &gt;addmore&lt;/button&gt;
         &lt;button id="rmvmrr" class="sitehtn" &gt;Cancel&lt;/button&gt;
  
       &lt;br /&gt;
       &lt;/div&gt;
     &lt;div id="faderad"&gt;
          &lt;label&gt;
        &lt;input type="radio" name="sitewebGroup" value="Agence" id="agenceRadio" 
      class="radioBtn" /&gt;
       Varied
      &lt;/label&gt;
  
     &lt;input type="text" name="textfield3" class="sitehtn" /&gt;
  
          &lt;input type="text" name="textfield" class="sitehtn" id="txt5" /&gt;   
            &lt;input type="text" name="textfield" class="sitehtn" id="txt6" /&gt;  
           &lt;input type="text" name="textfield" class="sitehtn" id="txt7" /&gt;   
              &lt;input type="text" name="textfield" class="sitehtn" id="txt8" /&gt;             
  &lt;/div&gt;                  
          &lt;/div&gt; 
      &lt;/div&gt; 
         &lt;/body&gt;
          &lt;/html&gt;
  </code></pre>
  
  <p>Iam just newcommer to this so please provide some guiding with your valueble comments</p>