I need your help. When I am using unescapedHtml, I am able to see option to fullscreen the video played in iframe. On the other hand, when I am using innerHTML, it is not working. I need to use innerHTML to get its element. So, please help. 

Component code -
 
<aura:component >
    <aura:handler name="render" value="{!this}" action="{!c.onRender}"/>    
    <aura:attribute name="myhtml" type="string" />
    <div id="articleContainer" aura:id="container"/>    
    <aura:unescapedHtml value="{!v.myhtml}"/>    
</aura:component>


Controller code -

({
    onRender: function(component, event, helper) {
        var myhtml = '<iframe allowfullscreen width="560" height="315" src="https://www.youtube.com/embed/hBrSHW-vLgw" title="Rockstar Buddies Channel" frameborder="0"></iframe>';
        var el = document.createElement( 'html' );
        el.innerHTML = myhtml;        
        var divContainer = component.find('container');
        if (divContainer){
            divContainer.getElement().innerHTML = el.innerHTML;
        }
        
        component.set("v.myhtml", myhtml);
    },
})

I need your help. When I am using unescapedHtml, I am able to see option to fullscreen the video played in iframe. On the other hand, when I am using innerHTML, it is not working. I need to use innerHTML to get its element. So, please help. 

Component code -
 
<aura:component >
    <aura:handler name="render" value="{!this}" action="{!c.onRender}"/>    
    <aura:attribute name="myhtml" type="string" />
    <div id="articleContainer" aura:id="container"/>    
    <aura:unescapedHtml value="{!v.myhtml}"/>    
</aura:component>


Controller code -

({
    onRender: function(component, event, helper) {
        var myhtml = '<iframe allowfullscreen width="560" height="315" src="https://www.youtube.com/embed/hBrSHW-vLgw" title="Rockstar Buddies Channel" frameborder="0"></iframe>';
        var el = document.createElement( 'html' );
        el.innerHTML = myhtml;        
        var divContainer = component.find('container');
        if (divContainer){
            divContainer.getElement().innerHTML = el.innerHTML;
        }
        
        component.set("v.myhtml", myhtml);
    },
})

Hello everyone,
As everyone know, in community we have standard navigation in Header, unlikey we can add new Tabs here, but tab will always display only name not images. I have requirement to show Image & name in tab. I tried to create custom navigation to replace with existing one. but i didnt find any. please share if any thoughts.