i want use same name buttons, click button , show solution button. example click on first button(task) show first solution(solution). because want lot of task - solution pairs. answers.
here code:
<head> <meta charset="utf-8"> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> </head> <body> <div class="task"> <button>task</button> <div class="solution">solution</div> </div> <div class="task"> <button>task2</button> <div class="solution">solution2</div> </div> </body> <script> $(document).ready(function () { $("button").click(function () { $(".solution").slidetoggle("slow"); }); }); </script>
use jquery's .siblings function:
$(document).ready(function() { $("button").click(function() { $(this).siblings(".solution").slidetoggle("slow"); }); });<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="task"> <button>task</button> <div class="solution">solution</div> </div> <div class="task"> <button>task2</button> <div class="solution">solution2</div> </div>
Comments
Post a Comment