take span class value in jquery -


i failed value of span class click in jquery. put value of 2 differnt sapn value in if condition. if(span value == this){}else {} need span value in jquery function. code :

<div class="two toggle_height">     <h6 style="padding: 0 171px;">is active</h6>     <div class="button-wrap button-active">       <div class="button-bg">          <div class="button-out"><span class="out">off</span></div>          <div class="button-in"><span>on</span></div>          <div class="button-switch"></div>       </div>     </div>   </div>  jquery:      $('.button-wrap').on("click", function(){     $(this).toggleclass('button-active');    }); 

$('.button-wrap').on("click", function(){            $(this).toggleclass('button-active');        });
.two .button-wrap {  width: 113px;  margin: 7px auto 0;  cursor: pointer;  padding: 1px;   }  .two .button-bg {  width: 100%;  background-color: #ddd;  border-radius: 0px;  padding: 2px 0px;  color: #fff;  ----------  transition: 0.2s ease;    }  .two .button-active .button-bg {  background-color: #22dd22;  }  .two .button-switch {  position: relative;  left: 0px;  width: 37px;  height: 16px;  border: solid 5px;  border-radius: 0px;  transition: 0.2s ease;  margin-top: 1px;  text-align: center;  margin-left: 1px;  }  .two .button-active .button-switch {  left: 62px;  }  .two .button-in,  .two .button-out {  position: absolute;  transition: 0.2s ease;  padding-top: 4px;  font-size: 0.8em;  text-transform: uppercase;  font-weight: bold;  padding-left: 4px;  }  .two .button-in {  margin-left: 75px;  }  .two .button-out {  margin-left: 18px;  color: #dd2222;  }  .two .button-active .button-out {  color: #fff;  }  .two .button-active .button-in {  color: #22dd22;  }  .two .button-active .button-bg {  background-color: #000;  }  /*.............  btn closed  .............*/  .out{  margin-left: -7px;  }  .all_btns{  /* [disabled]float:right; */  }  .upload_img{  margin-left: -3px;  }  .footer_botm{  margin-bottom: -19px;  }  .footer_botm{  margin-bottom: -19px;  background-color: rgba(232, 219, 219, 0.4);  border-radius: 6px;  }  .choose_efil{  margin-left: 4px !important;  }  element.style {  }  .total_footer.title {  margin-top: 11px;  padding: 5px;  width: 98%;  margin-bottom: -30px;  }  .txt_label{  margin-left: -12px !important;  }  .two {  margin-left: 7px;  margin-top: -29px;  }  .module_toggle{  margin-top: -13px !important;  margin-left: -36px !important;  }
<div class="two toggle_height">                                  <h6 style="padding: 0 171px;">is active</h6>                                      <div class="button-wrap button-active">                                          <div class="button-bg">                                              <div class="button-out"><span class="out">off</span></div>                                              <div class="button-in"><span>on</span></div>                                              <div class="button-switch"></div>                                                                                                                                         </div>                                      </div>                              </div>

$(".out").on("click", function() {    alert( $(".out").html()) // alerts off }) 

Comments

Popular posts from this blog

matlab - "Contour not rendered for non-finite ZData" -

delphi - Indy UDP Read Contents of Adata -

javascript - Any ideas when Firefox is likely to implement lengthAdjust and textLength? -