using Jquery selector with an array

Question

i am trying to use jquery selector with and array of objects. here is an example..

//Declaration
    var filterItems = Array();
    filterItems[0] = { clickDiv: "CategoryPanelHeader", div: "NarrowByCategoryPanelWrapper" };
    filterItems[1] = { clickDiv: "ExpandYourResultsHeader", div: "ExpandResultPanelWrapper" };
    filterItems[2] = { clickDiv: "Keyword", div: "KeywordDiv" };
    filterItems[3] = { clickDiv: "Manufacturer", div: "NarrowByManufacturerPanelWrapper" };
    filterItems[4] = { clickDiv: "Credentials", div: "CredentialsDiv" };

and the selector

$(document).ready(function () {
  //binds the click events...
  for (var i = 0; i < filterItems.length; i++) {
     $('#'+ filterItems[i].clickDiv).live('click', function () {
     togglemenu($('#' + filterItems[i].div));
     });
  }
});

i am able to read each item properly when i make an alert but jquery is not binding the click events.

how would i go about using an array to bind the onclick events?

As oGeez said. Try [`.on`](https://api.jquery.com/on/) instead, see if that makes a difference. — Paul Richter, Mar 31 '14 at 16:45
.on instead of .live make an error P.S. see above i edited the ver. i am using 1.8.14 — Ishey4, Mar 31 '14 at 16:47
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures#Creating_closures_in_loops.3A_A_common_mistake — Arun P Johny, Mar 31 '14 at 16:47
`$(document).ready(function () { $.each(filterItems, function (i, item) { $(document).on('click', '#' + item.clickDiv, function () { togglemenu($('#' + item.div)); }); }) });` — Arun P Johny, Mar 31 '14 at 16:49
arun that code still does not work.. i can see all the items in the the array but they are not binding properly — Ishey4, Mar 31 '14 at 16:54
if is move the event to the onclick event i can get the divs to toggle.. but they all toggle at once.. not individualy — Ishey4, Mar 31 '14 at 16:56

score 0 · Answer 1 · answered Mar 31 '14 at 17:29

i got it! you just have to call an outside function

   $(document).ready(function () {
            // gets all the click parameters...
            for (var i = 0; i < filterItems.length; i++) {
                bindClicks(($('#' + filterItems[i].clickDiv)), ($('#' + filterItems[i].div))  );
            }
        });
           function bindClicks(clickdiv, expanddiv) {
             //binds the click events
            clickdiv.click(function () {
                togglemenu(expanddiv);
            });
        }

using Jquery selector with an array

1 Answers1