It would seem an elementary task, I fight the second day. I draw objects through a for in loop, it took the option to hide / show the entire set of elements, it turns out to hide only one. This is raphaeljs, but I think the situation is typical in general for js.

var balls = { ball_01: { name: "ball01", x: 100, y: 206, }, ball_02: { name: "ball02", x: 263, y: 206, }, ball_03: { name: "ball03", x: 200, y: 206, } }; for (var circle in balls) { var allcircle = p.circle(balls[circle].x, balls[circle].y, 10).attr(styleButton); button.click(function(){ allcircle.hide(); //скрывает один элемент, хотя allcircle в консоль выводит всю коллекцию }); }; 

Fully code here - https://jsfiddle.net/jfw0vo5c/3/

    1 answer 1

    I think you can try to separate the creation and deletion for example like this

     var allcircle = []; for (var circle in balls) { allcircle[circle] = p.circle(balls[circle].x, balls[circle].y, 10).attr(styleButton); }; button.click(function(){ for( var tt in allcircle){ allcircle[tt].hide(); } });