Помехи с тегом <button>

Question

Кажется, у меня проблемы с кнопками поиска и календаря. Они используют ту же функцию, что и из кнопок моего архива в блоге.

    <script>
    $('button').each(function() {

      /* "each" in jQuery lets us apply what's inside here to each button individually without having to give them each their own names. Imagine this code going down the line and repeating everything below for each of the buttons. */

      var $thisButton = $(this);

      /* To refer to the individual button inside of this section we can use $(this), but to try and make the rest of this more clear, I'm going to rename $(this) to $thisButton */

      $thisButton.click(function() {

        var $thisButtonsDropdown = $thisButton.siblings();

        /* Sibling here means "on the same level as the button." We need to do this to find the section of months or links that matches this button we clicked, so that we slide up/down the right one--the one we want is the one that is next to it, its sibling. */

        /* This part should be a little familiar! */
        if ($thisButtonsDropdown.is(':visible')) {
          $thisButtonsDropdown.slideUp();
          $thisButton.removeClass('flip');
        } else {
          $thisButtonsDropdown.slideDown();
          $thisButton.addClass('flip');
        }
      });
    });
    </script>

Кто-нибудь знает, почему это происходит? Вот код для моих кнопок поиска и календаря:

/* Start JS Calendar */

.calendar-wrapper {
  width:175px;
  height:175px;
  margin:3em auto;
  margin-left:20px;
  padding:2em;
  border:0px solid @calendar-border;
  border-radius:5px;
  background:none;
  position:absolute;
    top:0px;
    left:20px;
    z-index:100;
  cursor:text;

}
table {
  clear:both;
  width:208px;
  height:100px;
  border:5px double #000;
  border-radius:0px;
  border-collapse:collapse;
  color:@calendar-color;
  background:white;
  position:absolute;
    top:0px;
    left:0px;
  cursor:text;
}
td {
  font-family:Overpass, Arial, Verdana, Trebuchet MS, Segoe UI, Lucida Sans;
  height:8px;
  text-align:center;
  vertical-align:middle;
  border-right:1px solid black;
  border-top:1px solid black;
  width:100% / 7;
  cursor:text;
}
td.not-current {
  color:#ccc;
  font-family:Overpass, Arial, Verdana, Trebuchet MS, Segoe UI, Lucida Sans;
  cursor:text;
  font-size:17px;
}
td.normal {}
td.today {
  font-weight:bold;
  color:#98d6e3;
  font-family:Overpass, Arial, Verdana, Trebuchet MS, Segoe UI, Lucida Sans;
  text-shadow:none;
  cursor:text;
}

thead td {
  border:none;
  color:#6871b8;
  text-transform:capitalize;
  text-shadow:0px 2px 1px #aaa;
  font-size:1.2em;
  font-family:Overpass, Arial, Verdana, Trebuchet MS, Segoe UI, Lucida Sans;
  background:rgba(255, 255, 255, 1);
  padding-left:6px;
  padding-right:6px;
  padding-top:3px;
  width:275px;
  cursor:text;
  z-index:0px;
}

#btnPrev {
  background:none;
  border:none;
  color:rgba(153, 159, 207, 1);
  font-family:Laila, Segoe UI Light, Arial, Segoe UI, Georgia, Verdana;
  font-weight:normal;
  font-size:1em;
  float:left;
  margin-bottom:20px;
  position:absolute;
  top:10px;
  left:29px;
  z-index:250;
}
#btnNext {
  background:none;
  border:none;
  color:rgba(153, 159, 207, 1);
  font-family:Laila, Segoe UI Light, Arial, Segoe UI, Georgia, Verdana;
  font-weight:normal;
  font-size:1em;
  float:right;
  margin-bottom:20px;
  position:absolute;
  top:10px;
  left:227px;
  z-index:250;
}
#btnPrev:hover {
  border:none;
  outline:none;
  font-size:1em;
  cursor:pointer;
  font-family:Laila, Segoe UI Light, Arial, Segoe UI, Georgia, Verdana;
  text-shadow:0px 0px 2px #fff, 0px 0px 2px #fff;
  text-transform:none;
  transition:all 0.3s ease;
  color:white;
  z-index:100;

}

#btnNext:hover {
  border:none;
  outline:none;
  font-size:1em;
  cursor:pointer;
  font-family:Laila, Arial, Segoe UI, Georgia, Verdana;
  text-shadow:0px 0px 2px #fff, 0px 0px 2px #fff;
  text-transform:none;
  transition:all 0.3s ease;
  color:white;
  z-index:100;
}


.days {
  color:#7b6f7d;
  background:#fff;
  cursor:text;
  font-family:Overpass, Arial, Verdana, Trebuchet MS, Segoe UI, Lucida Sans;
}

/* End JS Calendar */ 

<div class="calendar-wrapper">
  <button id="btnPrev" type="button">&#10210;</button>
      <button id="btnNext" type="button">&#10211;</button>
  <div id="divCal"></div>
</div>

Я предполагаю, что они используют один и тот же тег, хотя я не уверен. Кто-нибудь знает, что может происходить, и что происходит наверняка?