Hey all,

Have a slight issue which i could use some help on - Making an accordion content element - When a user opens a drop down element an image i have placed on the side changes from an arrow facing right to an arrow facing left to show that the column is open. but when the user clicks on another accordion tab / panel the arrow does not revert back and i do not know how to code this as i am a complete novice with jquery!

Have taken this code from an online source and implemented it / change elements but you will see "img1" and "img2" these are the two images in context.

$(document).ready(function() {
                $('.accordionButton').click(function() {
                                //REMOVE THE ON CLASS FROM ALL BUTTONS
                                //NO MATTER WHAT WE CLOSE ALL OPEN SLIDES
                                //IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT
                                if($(this).next().is(':hidden') == true) {
                                                //ADD THE ON CLASS TO THE BUTTON
                                                //OPEN THE SLIDE
                CLOSES ALL S ON PAGE LOAD


If someone could show me a solution / explain how to do this, itd be a great help!

Many thanks