Using Jquery in an Info Window

[deleted-user-K_IRAXrpGKsG]

Hello, I am developing a campus map and need some help! I am attempting to add a jquery slider in an info window to give the user a "more information" option" However, I'm not quite sure how to add ta jquery element into a info window. Can someone please tell me what's wrong with this code?

   var infoTemplate = new esri.InfoTemplate();
        infoTemplate.setTitle("<b>${BldgName}</b>");
        infoTemplate.setContent("${Type}<br/>"
  + "${Hours}<br/>"
  + $(document).ready(function(){
    $(".flip").click(function(){
                                $(".panel").slideToggle("slow");
                         });
                   })
  );

[StephenLead]

Patrick,

I'm not an expert on jQuery, but I think you might want to put the jQuery code outside of the infoWindow, and in the main JS section of your page:

<script type="text/javascript">
$(document).ready(function(){
 $(".flip").click(function(){
         $(".panel").slideToggle("slow");
        });
})

[MattDriscoll]

the .click function likely won't work unless the .flip selector is in the HTML DOM on page load. I would use the .on function to handle this. This will apply to any elements with the class flip that are inserted after page load.

$(document).ready(function(){
  $(document).on('click', '.flip', function(){
      $(".panel").slideToggle("slow");
  });
});