I have the following in script in my web app which contains a lot of duplication. How can I cut down on this duplication and generally improve my code? $('a#newAuthority').on(click, function() {    var $newAuthorityContainer = $(.new-authority-container);    var $row = $('<div />', {        class: 'row'    }).appendTo($newAuthorityContainer);    var $large11 = $('<div />', {        class: 'large-11 columns'    }).appendTo($row);    var $input = $('<input>', {        type: 'text',        placeholder: 'email@domain.com',        class: 'authority-email'    }).appendTo($large11);    var $large1 = $('<div />', {        class: 'large-1 columns'    }).appendTo($row);    var $removeContainer = $('<div />', {        class: 'remove-container'    }).appendTo($large1);    var $remove = $('<a>', {        href: '#',        class: 'remove'    }).html('<i class=fa fa-fa fa-remove></i>').appendTo(        $removeContainer);    return false;});$('a#newMember').on(click, function() {    var $newMemberContainer = $(.new-member-container);    var $row = $('<div />', {        class: 'row'    }).appendTo($newMemberContainer);    var $large11 = $('<div />', {        class: 'large-11 columns'    }).appendTo($row);    var $input = $('<input>', {        type: 'text',        placeholder: 'email@domain.com',        class: 'authority-email'    }).appendTo($large11);    var $large1 = $('<div />', {        class: 'large-1 columns'    }).appendTo($row);    var $removeContainer = $('<div />', {        class: 'remove-container'    }).appendTo($large1);    var $remove = $('<a>', {        href: '#',        class: 'remove'    }).html('<i class=fa fa-fa fa-remove></i>').appendTo(        $removeContainer);    return false;});$('input.button').on(click, function() {    var $authorityInputs = $('.authority-email');    var authortyEmails = [].map.call($authorityInputs, function(        $authorityInputs) {        return $authorityInputs.value;    }).join(',');    if ($('body.teamsnew').length) {        $('input#team_authority_emails').val(authortyEmails);    }    if ($('body.teamsedit').length) {        $('input#team_authority_emails').val('{' + authortyEmails + '}');    }    var $memberInputs = $('.member-email');    var memberEmails = [].map.call($memberInputs, function(        $memberInputs) {        return $memberInputs.value;    }).join(',');    if ($('body.teamsnew').length) {        $('input#team_member_emails').val(memberEmails);    }    if ($('body.teamsedit').length) {        $('input#team_member_emails').val('{' + memberEmails + '}');    }});$(document).on('click', '.remove', function() {     $(this).closest('.row').remove();    return false;});
jQuery form builder for parsing email array into single input
javascript;jquery;email
Extract the code that creates a row to a function, make it return the row created with all the elements inside of it, so that you can use it like this:var $newAuthorityContainer = $(.new-authority-container);var $row = createRow().appendTo($newAuthorityContainer);And then again later:var $newMemberContainer = $(.new-member-container);var $row = createRow().appendTo($newMemberContainer);Alternatively, pass in the container that you want to add the row to, for example:var $newMemberContainer = $(.new-member-container);createRow($newMemberContainer);The function for this latter example:function createRow($container) {    var $row = $('<div />', {        class: 'row'    }).appendTo($container);    var $large11 = $('<div />', {        class: 'large-11 columns'    }).appendTo($row);    var $input = $('<input>', {        type: 'text',        placeholder: 'email@domain.com',        class: 'authority-email'    }).appendTo($large11);    var $large1 = $('<div />', {        class: 'large-1 columns'    }).appendTo($row);    var $removeContainer = $('<div />', {        class: 'remove-container'    }).appendTo($large1);    var $remove = $('<a>', {        href: '#',        class: 'remove'    }).html('<i class=fa fa-fa fa-remove></i>').appendTo(        $removeContainer);}I don't see other troubling duplication. However, I see a bit troubling typo in the variable name authortyEmails. This could lead to errors, so I suggest to fix that.