# Load different table contents from mySql database using AJAX and display them

I've written a small application as a part of a much bigger project. This script grabs a bunch of tables from a MySQL database and displays them. The table that is being grabbed and displayed depends on which buttons a user clicks on. You also have the option to sort the tables from A-Z (or A-Ö as I'm Swedish) or Z-A (Ö-A). My concern is the fact that the overall project is becoming really big and I'm starting to notice some increased loading times, it's not by any means slow to the point that it's annoying but it's also not as fast as I would like it to be. This I want to improve.

• Is there anything in this code that I can D.R.Y up a bit and make it execute faster?
• Is there a downside to using self-invoking functions like I've done in this case? (It's not working when I call the functions manually that's why I was forced to doing it this way)
• Can I change anything so that code only executes if it has to? To improve execution time further?

bindElements: (function() {

var wrapper = $('#table-holder');$('#default ul li').on('click', function() {

$('#default span').html($(this).html());
});

$('.overview-nav').on('click', '.overview-btns', function() { var tableToGet =$(this).attr('id');

wrapper.children('table').remove();

promise.done(function(data) {
});

$('#default').children('span').html('A-Ö'); });$('.sub-options').on('click', function() {

var currentTable = $('#table-holder').children('table').attr('id'); var chosenSorting =$(this).html();

promise.done(function(data) {
wrapper.children('table').remove();
});
});

}()),
grabInfoTable: function(filename, sortBy) {

return $.ajax({ url: 'ajax/get' + filename + '.php', post: 'POST', data: 'sort_by=' + sortBy }); }, showList: (function() { function changeBorderRadius(value) {$('#default').parent().css({borderBottomLeftRadius: value + 'px',
});
}

$('#default').on('click', function(e) { //Prevent the dropdown ul from reappearing on mouseenter while fading out e.stopPropagation(); if ($('#default ul').is(':visible')) {
$('#default ul').stop().fadeToggle(); }).on('mouseleave', function() { changeBorderRadius(3);$('#default ul').fadeOut();