Question

I have an array of DOM elements. If the fourth one is clicked I want to hide the search box. If any of the other ones are clicked I want to show it. How would I do this? I currently have:

var app = {
    config: {
        tabs: [$("#tab1"), $("#tab2"), $("#tab3"), $("#tab4")],
        search: $("#search")
    },
    showHideSearch: function () {
        // Here I need to test if the fourth tab was clicked on then hide(); 
        // else if tabs one through three were clicked show
    }
}
app.showHideSearch();

Any help is appreciated. Thank you.

Answer 1

$.each(app.config.tabs, function(i, v) { 
  v.bind('click', function(){
    $('#searchbox').show();
    if(i==3)
      $('#searchbox').hide();
  });
});