Learning jQuery

You have already seen, How to use jQuery UI Icons in jQuery UI Button, but what if you are not fan of these icons and you want to have your own/custom image on the jQuery UI button, instead of these built-in icons. This can be done but it is not a straight forward thing but not difficult also.

As there is no property/attribute supported by jQuery UI Button to assign a custom image so one need to use a different path.

All is required to add an image around the button and set the text to empty string. And then attach jQuery UI Button to the HTML button.

$(document).ready(function() {
    $("#btnClose")
        .text("")
        .append("<img height="100" src="logo.png" width="100" />")
        .button();
});?

See result below

Feel free to contact me for any help related to jQuery, I will gladly help you.