针对单击的元素执行功能

Question

I am trying to execute a function with respect to the clicked element (here div with .redactor class).

If clicked the specified element ( .redactor ), then execute this function:

$('.redactor').on("click", function() {
    $(".redactor").each(function () {
        if($(this).hasClass("selected"))
        {
             destroy_redactor(current_edit);
             $(this).removeClass("selected");
        }
    });

    $(this).addClass("selected");
    current_edit = $(this);
    initialize_redactor(current_edit);
});

Or if clicked other than the specified element, execute this function if there is already an initialized redactor or else do nothing:

destroy_redactor(current_edit);

I saw this post as a reference. But it is not helping. It just removes all the divs.

I can't figure out how to execute the destroy_redactor(current_edit) function when clicked outside the .redactor div while there is already an initialized redactor for the current_edit .

Sample in codepen.io

Answer 1

how about adding the click listener on the document...

$(document).click(function(event) {
  var target = $(event.target);

  if (target.attr('class') == 'redactor') {
     //do something with it
  }
  else{
     // clicked on none of the redactor elements 
  }
});

if you need to find if there is a redactor active you can do something like this

$(".redactor.active") //will get you a div with both redactor and active class