removing disabled attribute from fieldset

removing disabled attribute from fieldset

Hi, i have a bunch of fields in a field set which i want to disabled, if someone wants to edit the form they simply click the edit button and it unlocks the fields for them to edit. I am disabling the fields by adding the disabled attribute to the field set itself. I also need to remove the top margin from my form groups when the inputs are enabled. This is my jquery code so far which i can't get to work.

  2. <script>
  3. $(document).on('click' function (event) {
  4. event.preventDefault();
  5.     var $btn = $(this);
  6.     var $container = $(this).closest('.details-container');
  7.     var $fieldset = $container.find('fieldset');
  8.     $fieldset.removeAttr("disabled");
  9.     $('.form-group.disabled').removeClass('disabled');
  10. });
  11. </script>
My original code looked liked like the below - but i wanted to make it cleaner rather than duplicating the code over again.

  2. $("#ContactAddressEdit").click(function(event){
  3. event.preventDefault();
  4. $('fieldset').removeAttr("disabled");
  5. $('.form-group.disabled').removeClass('disabled');
  6. });
  8. $("#ContactBillingEdit").click(function(event){
  9. event.preventDefault();
  10. $('fieldset').removeAttr("disabled");
  11. $('.form-group.disabled').removeClass('disabled');
  12. });
  14. $("#ContactPostagegEdit").click(function(event){
  15. event.preventDefault();
  16. $('fieldset').removeAttr("disabled");
  17. $('.form-group.disabled').removeClass('disabled');
  18. });

A fiddle can be found here