Cant iterate through an associative array using jquery.each

Question

Well, I have used jquery.each before but today seems to be my bad day as whatever I am doing is going way wrong. I used the following to get the values from the array but I get

TypeError: invalid 'in' operand a

JS

var updateBoard = function() {
        $.ajax({
            type: "POST",
            url: "engine/main.php",
            data: {code: 2},
            success: function(response) {
                $.each(response, function(i, val) {
                    console.log(i);
                });
                setTimeout(updateBoard, 2500);
            }
        });
    };
    updateBoard();

RESPONSE IN MY SUCCESS FUNCTION

Array
(
    [0] => Array
        (
            [cell] => a2
            [sign] => ◯
        )

    [1] => Array
        (
            [cell] => b2
            [sign] => ◯
        )

)

Answer 1

each its work only on jQuery element but response isn't bind with jQuery selector so just use javascript loop like this

you can use map function of es6 or foreachfunction if your response is an array

try :

response.map(function(obj){
  console.log(obj)
})

or

response.forEach(function(obj){
  console.log(obj)
})

source of MDN

foreach

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

map

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

Answer 2

Try with

var obj = JSON.parse(response);
$(obj).each(function(i, val) {
  console.log(val.cell);
  console.log(val.sign);
});