I've been tackling the challenge of creating an accordion and I'm almost there. However, I'm facing an issue where the arrow doesn't return to its original position after clicking the close "x" icon. The toggle works fine but the arrow remains pointing downward.
$('#main').each(function () {
var $accordion = $(this);
$accordion.find('.view-m').on('click', function () {
$accordion.find('.mobile-content-body').slideUp();
$accordion.find('span').css('transform', 'rotate(0deg)');
if (!$(this).next().is(':visible')) {
$(this).next().slideDown();
$(this).find('span').css('transform', 'rotate(90deg)');
$(this).next().slideDown();
$accordion.find('.close').click(function () {
$(this).parent().slideUp(500);
$(this).find('span').css('transform', 'rotate(0deg)');
});
}
});
});