How to onclick-trigger a non-native jQuery plugin's action? I've installed a 3rd-party jQuery plugin (it's an accordion).  It displays on my page, and works as expected.

I want to trigger one of the plugin's actions (open a particular slide) when I click on an image on my page.

I can't seem to get the  code &amp;/or syntax for doing that right.

The plugin I've installed is "EasyAccordion" (http://www.madeincima.eu/blog/jquery-plugin-easy-accordion/).  It's .js source is posted here: http://pastebin.com/55JB4pr2.

I'm using the plugin on a Drupal7 page.

I don't think that the specific plugin, or the fact that it's been used in Drupal, is relevant to the proper jQuery usage.

jQuery's bundled with Drupal.  I init the plugin on my page with:

    ( function ($) {
        Drupal.behaviors.myEasyAccordion = {
            attach: function(context,settings) {
                $('#accordion1',context).easyAccordion({
                    autoStart:     false,
                    ...
                });
            }
        };
    })(jQuery);


In my markup, I have

    ...
    &lt;div id="accordion1"&gt;
     ... EASYACCORDION MARKUP ...
    &lt;/div&gt;
    ...


Again, with this init &amp; markup, the accordion appears/works as expected.

On the same page, in another  I've added an image-link, i.e.,

    ...
    &lt;div id="myImg"&gt;
        &lt;a&gt;&lt;img src="myimg.png" /&gt;&lt;/a&gt;
    &lt;/div&gt;
    &lt;div id="accordion1"&gt;
     ...  EASYACCORDION MARKUP ...
    &lt;/div&gt;
    ...


I want to click on the image in the "myImg" div, and have the EasyAccordion snap to a specific open 'pane'.  The activation of a particular pane is addressed, I think, by the

    line #127                jQuery.fn.activateSlide = function() {


function, as seen at the pastebin-link I provided above.

Iiuc, I need to add code to the init function above, to tie the image-click to an action execution in the EasyAccordion.

My question is -- how?

I think I need to fire off (e.g., for slide #3),

    jQuery(this).activateSlide(3);


adding some variation of,

    $('#myImg').click(function () {
      ...
    });


to the init, attaching it to the EasyAccordion init's function().  Something like?

    ( function ($) {
        Drupal.behaviors.myEasyAccordion = {
            attach: function(context,settings) {
                $('#accordion1',context).easyAccordion({
                    autoStart:     false,
                    ...
                });
 ----&gt;          $('#myImg',context).easyAccordion({ ...
 ----&gt;          ?????????
 ----&gt;          });
            }
        };
    })(jQuery);


So far the right syntax has eluded me.  At least, I can't get the click-on-image to actually cause the specified item to 'activate' in the EasyAccordion.

These two posts,

http://stackoverflow.com/questions/5492258/easyacordion-jump-to-desired-slidenum-jquery-plugin
http://stackoverflow.com/questions/6243870/easyaccordion-jquery-plugin-callbacks


I think are close.  But I'm still not getting the syntax to crowbar into my Drupal.behaviors... stanza right.

Any guidance?
This works.

Adding a targetable class to each slide, so that markup's:

    ...
    &lt;div id="myImg"&gt;
        &lt;a&gt;&lt;img src="myimg.png" /&gt;&lt;/a&gt;
    &lt;/div&gt;
    &lt;div id="accordion1"&gt;
    &lt;dt class="slide_1" &gt;
         ...
    &lt;dt class="slide_2" &gt;
         ...
    &lt;/div&gt;
    ...


then, in the init,

    ( function ($) {
        Drupal.behaviors.myEasyAccordion = {
            attach: function(context,settings) {
                $('#accordion1',context).easyAccordion({
                    autoStart:     false,
                    ...
                });
                $('#myImg',context).click(function() {
                    $("dt.slide_1").activateSlide();
                });
            }
        };
    })(jQuery);


Now, a click on the img in the #myImg div opens the target slide ... here, 'slide_1', as intended.