GWT : failed to pick up html element by id as rootpanel returns null

I am new in GWT. We are using GWT 2.4.0, jdk 1.6, mvp4g 1.4.0.

I am trying to build an web application wher I have to embed some html code in the view and then have to pick up a specific by id ,in that html, from the view to add or remove elements or widgets. My html codes are embedded fine but pulling up elements are not working.

Here is my HTML file looks like :

<table align="center" border="1" cellpadding="1" cellspacing="10" id="transaction_monitor" style="width:100%;border: 1px solid black;padding: 5px;">
    <tbody>
        <tr id="tran_header" style="background-color:#CCFFFF;border:0px">
            <td colspan="2">&nbsp;</td>
        </tr>
        <tr id="tran_body">
            <td style="background-color:#CCFFFF;">
            <div id="clientContainer"></div>
            </td>
            <td style="background-color:#CCFFFF;">&nbsp;</td>
        </tr>
        <tr id="tran_footer" style="background-color:#CCFFFF;">
            <td colspan="2">&nbsp;</td>
        </tr>
    </tbody>
</table>

In the view I have embedded this html code by :

    flexTableLayout = new FlexTable();

    initWidget( flexTableLayout );

    //Window.alert(Resources.INSTANCE.synchronous().getText());

    HTML htmlPanel = new HTML();
    String html = Resources.INSTANCE.synchronous().getText();
    htmlPanel.setHTML(html);

    flexTableLayout.setWidget( 0, 0, htmlPanel );

This part is working fine and creating the view as expected. And with F12 I could find div id="clientContainer" part in the browser-page-source.

But after that I was trying to get "div" element from that html by id "clientContainer" and add label to it as :

Label lblFile = new Label( "File:" );
RootPanel.get("clientContainer").add(lblFile);

And this part is not working as expected. As I tested, I found that "RootPanel.get("clientContainer")" is returning null.

I , even, tried with

Document.get().getElementById("clientContainer").add(lblFile);

And failed as well as Document.get().getElementById("clientContainer") is null.

My .gwt.xml is :

  <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 1.6.4//EN" "http://google-web-toolkit.googlecode.com/svn/tags/1.6.4/distro-source/core/src/gwt-module.dtd">
<module rename-to='onlinetoolkit'>
  <!-- Inherit the core Web Toolkit stuff.                        -->
  <inherits name='com.google.gwt.user.User'/>

  <!-- Inherit the default GWT style sheet.  You can change       -->
  <!-- the theme of your GWT application by uncommenting          -->
  <!-- any one of the following lines.                            -->
  <inherits name='com.google.gwt.user.theme.standard.Standard'/>

  <!-- Other module inherits                                      -->
  <inherits name='com.mvp4g.Mvp4gModule'/>
  <inherits name="com.google.gwt.resources.Resources" />

  <!-- Specify the app entry point class.                         -->
  <entry-point class='com.mvp4g.client.Mvp4gEntryPoint'/>
</module>

Can anyone point me what I am missing?

Thanks in advance.

Solution

I figured it out that my flexTableLayout was not attached to rootpanel yet. It was too early to query for that.