I am tring to create "Sinking ships" using jQuery

Question

So far I am tring to make functions for placing ships on board and I have some problems with function for checking is some field available. My basic idea is to have one method which will be called on button click:

$("#dodaj1x1").click(function(){
        var raspolozivo=parseInt($("#raspolozivo1x1").text());
        if(raspolozivo>0){

            generisi1x1();//call for function that generate random field

            var novoRaspolozivo= raspolozivo-1;
            $("#raspolozivo1x1").html(novoRaspolozivo);
        }
        else{
            alert("Rasporedjeni svi raspolozivi brodovi ovog tipa!");
        }
    });

and it will call function to generate random field:

function generisi1x1(){
            var minR = 0;
            var maxR = 9;
            var minK = 0;
            var maxK = 9;
            randRed=Math.floor(Math.random() * (maxR - minR + 1)) + minR;
            randKol=Math.floor(Math.random() * (maxK - minK + 1)) + minK;
            proveri1x1(randRed,randKol);//call to function to check is field available
    }

than function generisi1x1() calls function that checks is that field available:

function proveri1x1(randRed,randKol){
        for(i=randRed-1;i<randRed+2;i++){
            for(j=randKol-1;j<randKol+2;j++){
                if($(".red"+i+".kolona"+j+"").hasClass('deoBroda')){
                    alert("red:"+" "+i+" kolona:"+j);
                    generisi1x1();
                }
                else { postavi1x1(randRed,randKol);}
            }
        }
    }

And my problem is that sometimes this work great(at least it looks that work great,maybe pure luck), and sometimes it generate only 3 ships 1x1(there should be 4) , sometimes it show me message about problem and generate 5 ships(4 on right places, 1 on bad) etc.

Printscreen of bad case: Added ship 1x1 on position 5,3 right next to ship 4x1

Here is live demo of entire code: Live demo

So far I made available to insert ships 4x1 and 1x1, and doing check only for 1x1, plan is to do the same for all ships, any help would be great.

Answer 1

You will find it easier to understand if proveri1x1() performs the checks and returns true or false, and generisi1x1() performs the postavi1x1() action;

function generisi1x1() {
    var minR = 0, maxR = 9, minK = 0, maxK = 9;
    randRed = Math.floor(Math.random() * (maxR - minR + 1)) + minR;
    randKol = Math.floor(Math.random() * (maxK - minK + 1)) + minK;
    if(proveri1x1(randRed, randKol)) { //call to function to check is field available
        postavi1x1(randRed,randKol);//set
    } else {
        generisi1x1();//try again
    }
}

function proveri1x1(randRed, randKol) {
    for(var i=randRed-1; i<randRed+2; i++) {
        for(var j=randKol-1; j<randKol+2; j++) {
            if($(".red" + i + ".kolona" + j).hasClass('deoBroda')) {
                return false;
            }
        }
    }
    return true;//<<<< note the position of this return statement
}