Polymer 1.0 styling not working

Question

I want to create category list with sub category. The sub category will open when user clicks on the parent category. This is like a multi level menu tree.

The functionality works fine, but the style for the child nodes is not applying. The reason is that I create the sub menu dynamically and I cannot set the style rules.

Here is my code:

<template>
    <div id="cat_menu">
        <!--<category-service id="service" categories="{{categories}}"></category-service>-->
        <iron-ajax id="ajax"
            auto
            url="../api/index.php"
            method="POST"
            last-response="{{categories}}"
            params='{"tag":"get_cat_list"}'
            handleAs="json">
        </iron-ajax>
            <template is="dom-repeat" items="{{categories.cat_list}}" filter="getParent" id="t">
                <paper-fab mini id="fab_{{item.category_id}}" icon="edit" class="p_fab"></paper-fab>
                <paper-menu id="{{item.category_id}}" class="cat_item" on-click="selectAction">
                    <span  >{{item.category_name}}</span>
                </paper-menu>
            </template>
    <div>
</template>


selectAction: function (e, detail) {
    var str = '';
    if (detail) {
        var selectedItem = e.currentTarget;
        //Polymer.dom(selectedItem).childNodes[1].innerHTML = '';
        for (var i = 0; i < this.categories.cat_list.length; i++) {
            //var item = new Object;
            var item = this.categories.cat_list[i];
            if (selectedItem.id == item.parent_id) {
                var container = document.createDocumentFragment();
                var paper_submenu = document.createElement('paper-menu');

                paper_submenu.id = item.category_id;
                paper_submenu.innerText = item.category_name;
                paper_submenu.className = 'cat_item';
                //paper_submenu.classList.add('cat_item');
                paper_submenu.onclick = 'selectAction';
                Polymer.dom(selectedItem.childNodes[1]).appendChild(paper_submenu);
                Polymer.updateStyles();
            }
        }
    }
}

CSS Style:

.cat_item {
    border: 1px solid #acdcd8;
    margin: 5px;
    background-color: rgb(255, 255, 255);
    padding-left: 10px;
}

The element cannot see this class cat-item. Can someone please help me solve this?