Surface Elimination not proper in my webgl code

Three triangles are rotating clockwise around the y-axis. However, there are some "surface elimination" problems when the triangles overlap. All the time, only one triangle remains in front. I have OR ED, the DEPTH_BUFFER_BIT and depthMask enabled too, so the depth buffer is writable. But this does not solve my problem.

I am unable to paste the full project's code here, but I may provide the draw function below.

function draw() {

  if (objects.length != 0) {
    gl.clearColor(0, 0, 0, 1)
    gl.depthMask(true)
    gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT)

    for (var index = 0; index < objects.length; index++) {
      gl.uniformMatrix4fv(program.perspectivePointer, false, program.perspectiveMatrix)
      gl.uniformMatrix4fv(program.worldTransformPointer, false, program.worldTransformMatrix)
      gl.bindBuffer(gl.ARRAY_BUFFER, masterVertexBuffer)
      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(objects[index].getVertexList()), gl.STATIC_DRAW)
      gl.bindBuffer(gl.ARRAY_BUFFER, colorBuffer)
      gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(objects[index].getColorList()), gl.STATIC_DRAW)
      gl.drawArrays(gl.TRIANGLE_STRIP, 0, 3)
    }
  }
  requestAnimationFrame(draw, program)
}

Please ask for the any other stuff, if needed. I have also tried depth sorting, but no luck.