javascript - Hide clicked element and show the element right after it using jQuery -
i want put questions in html text, answers hidden until user clicks on button/link/etc, disappears, , showing answer. answer replaces space used disappearing button/link. have questions go down page in article, not one.
so example, "[my thoughts]" button or link:
text text text abc need anything? [my thoughts] text text text, text, text.
clicking on [my thoughts] becomes:
text text text abc need anything? abc needs a lot of def, , abc if things taken slowly. additionally, abc needs lot of sleep. text text text, text, text.
per comment: closest thing found, isn't right, want keep using going down page:
thanks per gothdo, i'm working with:
<!doctype html> <html> <head> <title>test3</title> <script> $("button").click(function() { $(this).hide(); $(this).next().css("visibility", "visible"); }); </script> <style type="text/css" > div { visibility: hidden; } </style> </head> <body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button>test</button><div>test test test</div> </body> </html>
try code:
$element.click(function() { $(this).hide(); $(this).next().css("visibility", "visible"); });
code snippet:
$("button").click(function() { $(this).hide(); $(this).next().css("visibility", "visible"); });
div { visibility: hidden; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button>test</button> <div>test test test</div>
Comments
Post a Comment