Check if username already exists in sqlite using javascript

I am new to Javascript and am making a restaurant app which consists of Registration form i want check if the username already exists and if it does exist it should throw an alert to the user on button click. Somebody please help.

JavaScript code:

<script type="text/javascript">
        var db;
            var shortname="R_loginDB";
            var version = "1.0";
            var displayName = "R_loginDB";
            var maxSize = 90000;

            function onBodyLoad(){  
                db = openDatabase(shortname,version,displayName,maxSize);

                db.transaction(function(tx){
            <!--        tx.executeSql('DROP TABLE R');
         -->
                    tx.executeSql('CREATE TABLE IF NOT EXISTS R(UserName TEXT NOT NULL PRIMARY KEY,Password TEXT NOT NULL,ConPassword TEXT NOT NULL)');});


            }

            function ListDBValues() {

             if (!window.openDatabase) {
              alert('Databases are not supported in this browser.');
              return;
             }

             $('#output').html('');

             db.transaction(function(transaction) {
               transaction.executeSql('SELECT * FROM R;', [],
                 function(transaction, result) {
                  if (result != null && result.rows != null) {
                    for (var i = 0; i < result.rows.length; i++) {
                      var row = result.rows.item(i);
                      $('#output').append('<br>' +  ' ' + row.UserName+ ' ' + row.Password + ' '+ row.ConPassword );
                    }
                  }
                 });
             });

             return;

            }ListDBValues();

                function AddValues(){

                    var flag = false;
                    if ($("#pass").val() != $("#conpass").val()) {
                        alert("Passwords do not match.");
                        window.location.href = "r_register.html";

                    }
                    else if(flag==false){
                    try{
                        db.transaction(function(transaction) {
                        transaction.executeSql('INSERT INTO R(UserName, Password, ConPassword) VALUES (?,?,?)',[$('#uname').val(),$('#pass').val(),$('#conpass').val()]); });
                        flag=true;
                        window.location.href = "login.html";

                }
                catch(err){

                alert("Username " + $("#uname").val() + " is already taken!! Please chose another one");

                 window.location.href = "r_register.html";


                }
                }


                }
                AddValues();
        </script>

HTML code:

    <img id="bg" src="file:///android_asset/www/images/bigtable_1_blur.jpg"/>

    <input id="uname" type="text" placeholder="    Username"></input>
    <input id="pass"  type="password" placeholder="    Password"></input>
    <input id="conpass"  type="password" placeholder="    Confirm Password"></input>
    <a href="login.html"><p id="login"><b>Already have an account?<i><u>Login</u></i></b></p></a>

    <!-- <a href="second.html">
     -->
    <input id="btn" type="button" value="Register" onclick="AddValues()"></input><br/>

    <!-- </a>
     --> 
     <input id="btn2" type="button" value="show"  onclick="ListDBValues()"/></input>

    <span id="output"></span>


 </div>