[SalesForce] How to refresh child component data from server based on data changed in parent component

The comment by @Martin Lezer is the right answer, I post this so there is a complete answer with code:

On your parent component you should send the company object to each child component:

Parent Component

<aura:handler name="callParentEvent" event="c:ParentEvent" action="{!c.handleEventFromChild}"/>

<aura:iteration items="{!v.SECompanies}" var="company">
    <tr>
        <td><c:Actions aura:id="actionCmp" company="{!company}/></td>
    </tr>
</aura:iteration>

Now all company data would exist in the company attribute in your child component (just define the type same as in your parent).

Child Component Markup

<aura:component description="Actions">
    <aura:registerEvent name="callParentEvent" type="c:ParentEvent" />
    <aura:attribute name="company" type="same type as one record in the SECompanies array in your parent"/>
    <div class="slds-media__figure">
        <button class="slds-button slds-button--icon" aria-haspopup="true">
            <lightning:icon iconName="action:new_opportunity" class="slds-is-open" size="xx-small" title="Create new Opportunity" /> |
        </button>
        <button class="slds-button slds-button--icon" aria-haspopup="true" onclick="{!c.createSEComp}">
            <lightning:icon aura:id="editSEComp" iconName="action:edit" class="slds-is-open" size="xx-small" title="Edit SECompany"/>
        </button>
    </div>
</aura:component>

Child Component Controller

({
    createSEComp : function(component, event, helper){
        var company = component.get("v.company");

        // now you can use all of your company details
        var companyName = company.companyName;
        var companyId = company.companyId;
        // ....
        // if you want to update server you can do it here and inside the callback - call the parent event function callParent
    },

    // inform parent event from child
    callParent : function(component, event, helper){
        var event = component.getEvent('callParentEvent');
        event.fire();
    }
})

Now, For calling your parent, you need to:

1. Create a Lightning event (I have called it ParentEvent) of type component:

Lightning Component Event: ParentEvent

<aura:event type="COMPONENT" description="Event to call parent" />

2. On the child markup you need to register that event to be able to call it (also you name this registration callParentEvent to catch it in your helper and trigger it: <aura:registerEvent name="callParentEvent" type="c:ParentEvent" />

3. On the child helper you need to triger it whenever you want: var event = component.getEvent('callParentEvent').fire();

4. On your parent markup you need to listen to this event and call a method in your controller when it is triggered: <aura:handler name="callParentEvent" event="c:ParentEvent" action="{!c.handleEventFromChild}"/>

5. On your parent controller you need a method to handle the triggered event:

Parent Controller

// catch the event from the child
handleEventFromChild : function(component, event, helper){
    // do some stuff
}

Is it possible to achieve this without using JQuery?

Yes. If you can do something with JQuery, you can do it without JQuery. It's all JavaScript. As an addendum, anything you can do in JQuery you can do without JQuery and get better performance.

In the interest of keeping things brief, I'm not going to write out a full copy of your code with modifications, but a smaller, more generalized example that demonstrates how to do what you're trying to do.

<aura:application >
    <aura:attribute name="rows" type="Object[]" />
    <aura:handler name="init" value="{!this}" action="{!c.init}" />

    <table>
        <tbody>
            <aura:iteration items="{!v.rows}" var="row" indexVar="rowIndex">
                <tr>
                    <td data-index="{!rowIndex}" onclick="{!c.toggle}">
                        {!row.Name}
                    </td>
                </tr>
                <aura:if isTrue="{!row.expanded}">
                    <aura:iteration items="{!row.children}" var="child">
                        <tr>
                            {!child.Name}
                        </tr>
                    </aura:iteration>
                </aura:if>
            </aura:iteration>
        </tbody>
    </table>
</aura:application>

({
    init: function(cmp, evt) {
        cmp.set("v.rows", [
            {Name: "A",
            expanded: false,
            children: [
            { Name: "A1" },
            { Name: "A2" }
            ]},
            {Name: "B",
            expanded: false,
            children: [
            { Name: "B1" },
            { Name: "B2" }
            ]},
            {Name: "C",
            expanded: false,
            children: [
            { Name: "C1" },
            { Name: "C2" }
            ]}
                ]);
    },
    toggle: function(cmp, evt) {
        var rows = cmp.get("v.rows");
        rows[evt.target.dataset.index].expanded = !rows[evt.target.dataset.index].expanded;
        cmp.set("v.rows", rows);
    }
})

As you can see from this code, it's a trivial matter to simply render the extra rows when the "expanded" attribute has been toggled. You should be able to modify this example to suit your needs.

I've purposefully left out all styling and fluff to get to the heart of the matter, which I think this app demonstrates easily. Most likely, you'll just need to add an "expanded" attribute to your data's information, and then toggle it as appropriate.

There's lots of other things you could do with this as well, such as querying the database, making a callout, or whatever else it is you want/need to do to get the data.