How to change focus of the element in javascript

Question

I want to change the focus of the element in client side controller. I have below div element in component.

<div id="globalId" aura>
    {!v.body}    
</div> 

I want to change the focus by using below jQuery function but it is not working.$("#globalId").hide() is working but not the below function.

$("#globalId").focus();

Answer 1

Please do not make any changes to the DOM in javascript controllers. This functionality is not supported, may lead to race conditions, and will cause trouble in the security review. Make changes to the aura component objects, and let the renderer update the DOM. If you want to make DOM changes yourself, do this in a renderer, not in a controller, in order to ensure that your update will be the final update and will not be overwritten by the default renderer.