javascript - toggle() accordion script not working -


i've run roadblock , can't seem wrap head around why script not run on test page. have jquery linked, followed script. script know not js conflict. fiddle here: http://jsfiddle.net/dxway/7

var content = $('.content').hide();  $('.togglebtn').on('click', function() {     $(this).next('.content').slidetoggle();     return false; });  .togglebtn {     background:deepskyblue;     display:block;     float:left;     width:100%;     padding:10px;     border-bottom:1px solid #ccc;     border-top:1px solid #fff;     color:#fff;     cursor:pointer; }  .content {     background:skyblue;      float:left;     overflow:hidden;     width:100%;     padding:10px; }   <a class="togglebtn">click me!</a>  <div class="content">lorem ipsum dolor sit amet, consectetur adipisicing elit. inventore accusamus porro modi ut itaque ipsum natus explicabo vero sequi beatae libero voluptatibus sit culpa debitis tempore! sint eum ipsum consequatur!</div> 

your problem (on live example) you're running js script you've written (in head section) before dom loaded.

a simple fix make script run after document ready. can achieve entering document.ready()

<script> $(document).ready(function () {     var content = $('.content').hide();      $('.togglebtn').on('click', function() {         $(this).next('.content').slidetoggle();         return false;     });  }); </script> 

Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -