Looping through XML with jQuery

Handling Xml on web pages is used to be a headache when i started coding ajax events. Most of the times we will be knowing the tag name of particular data we need and we can use

xml.find('result').find('userTypeDetails')

 But this is not always the case with xml.
I have a scenario in which i get an xml like the one follows as ajax response.

<result>
    <permissionDetails>
             <addBusiness>0</addBusiness>
             <viewBusiness>1</viewBusiness>
             <viewBusinessChargeDetails>1</viewBusinessChargeDetails>
             <editBusinessProfile>0</editBusinessProfile>
             <editBusinessAccount>1</editBusinessAccount>
             <editBusinessGatewayInfo>1</editBusinessGatewayInfo>
             <deleteBusiness>1</deleteBusiness>
             <addBillingUser>0</addBillingUser>
             <viewBillingUser>0</viewBillingUser>
             <viewBillingUserChargeDetails>0</viewBillingUserChargeDetails>
             <editBillingUserProfile>1</editBillingUserProfile>
             <editBillingUserAccount>1</editBillingUserAccount>
             <deleteBillingUser>1</deleteBillingUser>
             <viewCharge>0</viewCharge>
             <editCharge>1</editCharge>
             <viewRegularReport>0</viewRegularReport>
             <addRegularReport>0</addRegularReport>
             <editRegularReport>0</editRegularReport>
             <deleteRegularReport>0</deleteRegularReport>
             <viewAdvancedReport>1</viewAdvancedReport>
             <addAdvancedReport>0</addAdvancedReport>
             <editAdvancedReport>1</editAdvancedReport>
             <deleteAdvancedReport>1</deleteAdvancedReport>
             <viewUser>0</viewUser>
             <addUser>0</addUser>
             <editUser>1</editUser>
             <deleteUser>1</deleteUser>
             <viewTemplate>0</viewTemplate>
             <addTemplate>0</addTemplate>
             <editTemplate>0</editTemplate>
             <deleteTemplate>1</deleteTemplate>
             <viewMail>1</viewMail>
             <sendMail>1</sendMail>
             <deleteMail>0</deleteMail>
             <profileDetailsView>1</profileDetailsView>
             <profileDetailsEdit>1</profileDetailsEdit>
             <viewAccount>0</viewAccount>
             <editAccount>1</editAccount>
             <deleteAccount>1</deleteAccount>
             <viewGatewayInfo>1</viewGatewayInfo>
             <editGatewayInfo>1</editGatewayInfo>
             <deleteGatewayInfo>0</deleteGatewayInfo>
    </permissionDetails>
</result>

Now i have to update an html page as in figure

One of the solution is to create checkboxes with name same as tagname in xml and iterate through the xml to check or uncheck the check box with name same as the current tag name depending upon value.
dd

xml.find('result').find('permissionDetails').each(function(){
    $(this).children().each(function(){
        var tagName=this.tagName;
        var val=$(this).text();
        if(val==1){
            $('input:checkbox[name='+tagName+']').attr('checked',true);
        }
        else if(val==0){
            $('input:checkbox[name='+tagName+']').removeAttr('checked');
        }
    })
});