Increase font size of whole web page on button click event using jquery

Question

I want to increase font size in whole page when user click on increase button. It will be increase on bases of current font size. Following is sample code :

Answer 1

Your question was quite unclear (changing whole page font size) while your coding seems to target the specific container classed .parent 'childrens'.

[credits to wared and Zaheer Ahmed ]

Your coding was close, but the simpliest jQuery method was to .test() with the .attr('style')

if (/font-size:[^;]+px/.test($(this).attr('style'))) {
        $(this).css("font-size","+=2");
    }

Here is your solution jsFidled here :

$("#trigger").click(function() {
    /* the overall body tag for relative units */
    $("body").css("font-size","+=5%");
    /* targetting inlined font-size in pixels */     
    $('*').each(function (index, value) {
        if (/font-size:[^;]+px/.test($(this).attr('style'))) {
            $(this).css("font-size","+=2");
        }
    });
});