javascript - Troubles with JS and jQuery -

before start, i'm going point out very, very new js , jquery, if seems simple fix stupid problem, expected.

i have problem want solve using js , jquery script used insert content page. here's part browser getting caught on in console/debugger thing:

if(fname != "" && fname != null) {     var newrow = 'a long string contents irrelevant here.'     $( ".all-waiting" ).append( newrow ); } 

the part it's getting hung on $ in jquery statement supposed used add contents of string specific page element. copied format of jquery statement tutorial online , verified against version had copied different project , managed have work successfully. doing wrong here? should doing append string newrow .all-waiting?

if makes difference, i'm introducing script via external js page imported html page of own creation.

thanks help!

edit: here's full relevant section of js code:

/*    ~~~~ get's variables url ~~~~    */ // syntax: geturlvars()["variable"]; function geturlvars() {     var vars = {};     var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {         vars[key] = value;     });     return vars; }  var fname  = geturlvars()["fname"]; var lname  = geturlvars()["lname"]; var action = geturlvars()["action"]; var other  = geturlvars()["other"];    if(fname != "" && fname != null) {     var newrow = '<tr><td class="time">00:00</td><td class="customer"><div class="cust-name">' + fname + ' ' + lname + '    </div><div class="cust-deets">female, 40</div></td><td class="area none">' + action + '</td><td class="menu">___</td></tr>'     $( ".all-waiting" ).append( newrow ); } 

and relevant html section:

<table class="all-waiting">     <tr>         <td class="time long">             15:30         </td>         <td class="customer">             <div class="cust-name">                 samantha wilson              </div>             <div class="cust-deets">                 female, 35             </div>         </td>         <td class="area">             foreign currency         </td>         <td class="menu">             ___         </td>     </tr>     <tr>         <td class="time">             09:00         </td>         <td class="customer">             <div class="cust-name">                 ethan blucher              </div>             <div class="cust-deets">                 male, 26             </div>         </td>         <td class="area">             business banking         </td>         <td class="menu">             ___         </td>     </tr> </table> 

the script supposed add new row table based on url parameters.

it seems you're not referencing or loading jquery before script.

first try replacing

<script src="js/jquery.js"></script>  

with...

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 

if not work issue of jquery not yet being loaded when attempt used it. if case, change answer, doubt is. chances replacing line work, , know code in question works when jquery loaded (as evidenced arun's fiddle). if works it's matter of getting correct path <script> tag's src attribute.

according comments have file structure like...

~/page.html ~/script.js ~/js/jquery.js 

so make sure have jquery source saved jquery.js in subfolder js under folder html file in - or find/download and/or update path accordingly.