calling html elements from iframe html a tag

calling html elements from iframe html a tag

one.html
---------
<html>
<body>
<iframe id="frid" width="100%" src="two.html" height="90%"></iframe>
<div data-role="popup" id="popupDialog" data-overlay-theme="a" data-theme="c" data-dismissible="false" style="max-width:400px;" class="ui-corner-all">
    <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
        <h3 class="ui-title">Enter your annotation text</h3>
<textarea rows="4" cols="50" id="TA"></textarea>
<a id="AnnotationText" href="#" data-role="button" data-inline="true" data-rel="back" data-theme="c">Ok</a>
<a href="#" data-role="button" data-inline="true" data-rel="back" data-theme="c">Cancel</a>
        <a href="#" id="reset" data-role="button" data-inline="true"  data-transition="flow" data-theme="b">Reset</a>
     </div>
</div>
</body>
</html>


in two.html i want to call popupDialog(popup) dialogue 
i tried like this but not succeeded

<a parent.href="#popupDialog" id="pop1" data-rel="popup" data-role="button"  data-inline="true"><img src="annotationicon.png"   id="pop"/> </a>

please help me 

thanks.