Drawing line in SVG

i'm trying to code Tic Tac Toe game. In this code, everything working fine, but when i want to add two lines as a symbol for cross (in this code only one fo example) it doesn't draw in target svg. It seems that element is added, because if i try to draw 3 crosses in line, code retus that "X" wins but a can't see any crosses. So it seems the problem is only in drawing. Anyone who know's where is the problem?

<!DOCTYPE HTML>
<html>
<head>
    <script type="text/javascript">
var filled;
var symbol_type;
var VyheiKomb;
var tu = 0;
var targetsvg;
var c;
var cxt;
var filledField = 0;
var w;
var y;
window.onload=function(){

filled = new Array();
symbol_type = new Array();
VyheiKomb = [[0,1,2],[3,4,5],[6,7,8],[0,3,6],[1,4,7],[2,5,8],[0,4,8],[2,4,6]];

for(var m = 0; m <= 8; m++){
filled[m] = false;
symbol_type[m]='';
}
}
function svgEvent(svgNumber){
targetsvg = "svg"+svgNumber;
c = document.getElementById(targetsvg);


if(filled[svgNumber-1] ==false){
    if(tu%2==0){
        var svg=c;
        var xmlns = "http://www.w3.org/2000/svg";
        var cross = document.createElementNS('http://www.w3.org/2000/svg', "line");
        cross.setAttribute("id", "line1");
        cross.setAttribute ("x1","5");
        cross.setAttribute ("y1", "15");
        cross.setAttribute ("x2", "15");
        cross.setAttribute ("y2", "5");
        cross.setAttribute ("stroke", "black");
        symbol_type[svgNumber-1] = 'X';
    }

    else{
        var svg=c;
        var xmlns = "http://www.w3.org/2000/svg";
        var kolecko = document.createElementNS(xmlns, "circle");
        kolecko.setAttribute("cx", 25);
        kolecko.setAttribute("cy", 25);
        kolecko.setAttribute("r", 15);
        kolecko.style.stroke= "#111"
        kolecko.style.strokeWidth="2px"
        kolecko.style.fill="none"
        svg.appendChild(kolecko);
        symbol_type[svgNumber-1] = 'O';
    }

    tu++;
    filled[svgNumber-1] = true;
  filledField++;
    checkForWiers(symbol_type[svgNumber-1]);

    if(filledField==9){
        alert("Rem�za");
        location.reload(true);
    }

}
else{
}

}
function checkForWiers(symbol){

for(var a = 0; a < VyheiKomb.length; a++){
if(symbol_type[VyheiKomb[a][0]]==symbol&&symbol_type[VyheiKomb[a][1]]== symbol&&symbol_type[VyheiKomb[a][2]]==symbol){
    alert(symbol+ " Vyhral");
    newGame();
}
}

}

function newGame(){
y=confirm("hr�t znovu?");
if(y==true){
    alert("Start!");
    location.reload(true);
}
else{
    alert("Hezk� den");
}

}
</script>
</head>
<body> 
<h1>Hra</h1><h2>Tic-Tac-Toe</h2>
<svg id = "svg1"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(1)"></svg>
<svg id = "svg2"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(2)"></svg>
<svg id = "svg3"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(3)"></svg><br/>
<svg id = "svg4"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(4)"></svg>
<svg id = "svg5"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(5)"></svg>
<svg id = "svg6"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(6)"></svg></br>
<svg id = "svg7"  width="50" height="50" style="border:3px solid red" onclick="svgEvent(7)"></svg>