Reg Resize of Div not working on the click of an image in JQuery

Reg Resize of Div not working on the click of an image in JQuery

Hi
 
I have HTML as below.
< div id ="sidebar-border">
< img id ="hidePanel" src ="~/images/arrow.png" />
</div>
 
I have JQuery syntax as below.
 
$(
"#hidePanel").click(function () {
      $( '#sidebar-border' ).resizable({
            minWidth: 210, maxWidth: 350, maxHeight: 290, minHeight: 290
      });
});
 
The above code is not working that is <div> is not getting resized when I click the image.
 
But same code works when called directly from <script> tag as below.
<script type="text/javascript">
  $('#sidebar-border').resizable({
            minWidth: 210, maxWidth: 350, maxHeight: 290, minHeight: 290
      });
</ script >
 
Could you please suggest why the same code is not working on image click?
 
Thanks in advance,
 
Best regards,
Usha.