frontend-coder · August 12, 2019 06:11 · Aug 12, 2019
diff --git a/Simple Jquery Accordion b/Simple Jquery Accordion
@@ -0,0 +1,18 @@
+<div>
+  <div class="acc-btn">Button 1</div>
+  <div class="acc-content">
+    Content 1
+  </div>
+</div>
+<div>
+  <div class="acc-btn">Button 2</div>
+  <div class="acc-content show">
+    Content 2
+  </div>
+</div>
+<div>
+  <div class="acc-btn">Button 3</div>
+  <div class="acc-content">
+    Content 3
+  </div>
+</div>
diff --git a/common.js b/common.js
@@ -0,0 +1,18 @@
+
+  $(function() {
+    $('.acc-btn').click(function() {
+      $('.acc-content').slideUp('normal');
+      $('.acc-btn').removeClass('acc-active');
+      if ($(this).next().is(':visible') == true) {
+        $('.acc-btn').removeClass('active');
+      }
+      if ($(this).next().is(':hidden') == true) {
+        $(this).next().slideDown('normal');
+        $(this).addClass('acc-active');
+      }
+      $('.acc-content').one().removeClass('show');
+    });
+
+    $('.acc-content').hide();
+    $('.show').show();
+  });
diff --git a/style.css b/style.css
@@ -0,0 +1,37 @@
+
+
+.acc-btn {
+  display: block;
+  position: relative;
+  margin-bottom: -2px;
+  border-radius: 0;
+  color: #fff !important;
+  background: #FF9000;
+  border: 1px solid #Fff;
+  padding: 10px 15px;
+  border-bottom: 1px solid transparent;
+  font-size: 18px;
+  color: inherit;
+  cursor: pointer;
+}
+
+.acc-content {
+  padding: 15px;
+}
+
+.acc-btn:before {
+  position: absolute;
+  top: 50%;
+  right: 15px;
+  font-size: 18px;
+  z-index: 9999;
+  margin-top: -13px;
+  font-family: FontAwesome;
+  content: "\f078";
+  color: #fff;
+}
+
+.acc-active:before {
+  font-family: FontAwesome;
+  content: "\f077";
+}