Alana 0 Report post Posted November 26, 2018 Hello! I am looking for some assistance with my drop down panel. When I try to add "<div id="panel"></div> to the "select to filter by type section", it does not toggle the panel at all. Can you tell me what I am doing incorrectly? http://jsfiddle.net/AlanaVibes/xNj9z/92/#&togetherjs=ROVpoPMv4L <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery UI Checkboxradio - Default functionality</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <link rel="stylesheet" href="/resources/demos/style.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $( function() { $( "input" ).checkboxradio(); } ); </script> </head> <body> <div class="widget"> <h1>Our Manufacturers</h1> <fieldset> <legend>Select a Territory: </legend> <label for="radio-1">All</label> <input type="radio" name="radio-1" id="radio-1"> <label for="radio-2">North Texas</label> <input type="radio" name="radio-1" id="radio-2"> <label for="radio-3">Oklahoma</label> <input type="radio" name="radio-1" id="radio-3"> <label for="radio-4">Arkansas</label> <input type="radio" name="radio-1" id="radio-4"> </fieldset> <script> &(document).ready(function(){ $("#flip").click(function(){ $("#panel").slideToggle("slow"); }); }); </script> <style> #panel, #flip { padding: 5px; text-align: left; background-color: white; border: solid 1px #c3c3c3; } #panel { padding: 50px; display: none; } </style> <div id="flip"> <h2>Type of Material</h2></div> <fieldset> <legend> Select to filter by Type </legend> <label for="checkbox-1">Wire & Cable</label> <input type="checkbox" name="checkbox-1" id="checkbox-1"> <label for="checkbox-2">Wire & Cable Accessories</label> <input type="checkbox" name="checkbox-2" id="checkbox-2"> <label for="checkbox-3">Conduit & Fittings</label> <input type="checkbox" name="checkbox-3" id="checkbox-3"> <label for="checkbox-4">Wiring Devices</label> <input type="checkbox" name="checkbox-4" id="checkbox-4"> <label for="checkbox-5">Enclosures & Wireway</label> <input type="checkbox" name="checkbox-4" id="checkbox-5"> <label for="checkbox-6">Lighting</label> <input type="checkbox" name="checkbox-4" id="checkbox-6"> <label for="checkbox-7">Fuses</label> <input type="checkbox" name="checkbox-4" id="checkbox-7"> <label for="checkbox-8">Tools & Fasteners</label> <input type="checkbox" name="checkbox-4" id="checkbox-8"> <label for="checkbox-9">Motor Control</label> <input type="checkbox" name="checkbox-4" id="checkbox-9"> <label for="checkbox-10">Specialty</label> <input type="checkbox" name="checkbox-4" id="checkbox-10"> </fieldset> </div> </body> </html> Quote Share this post Link to post Share on other sites
dsonesuk 901 Report post Posted November 26, 2018 One of those gremlins has replaced '$' with '&' &(document).ready(function(){ You got to watch out for those little blighter's. 1 Quote Share this post Link to post Share on other sites
Alana 0 Report post Posted November 26, 2018 Thank you very much! Quote Share this post Link to post Share on other sites
