Javascript TypeError: xxx is not a function

Question

Friends I came to a bit of problem. Everything was working fine before. But I can't rectify why it starts giving me such error.
Here is my JavaScript Code:

function newSupplier() {
    $('div#AddSupplier div.msg').html('').hide();
    $('div#AddSupplier div.loader').show();
    registerSupplier($('div#AddSupplier table.frm :input').serialize()).done(function (a) {
        if (a.Msg) {
            $('div#AddSupplier div.msg').html(a.Msg).removeClass('success').addClass('error').fadeIn();
        }
        else if (a.supid) {
            $('div#AddSupplier div.msg').html('Supplier <span class="l2">' + a.supid + '</span> Registered').removeClass('error').addClass('success').fadeIn();
            $('div#AddSupplier table.frm :input').val('');
        }
    }).always(function () {
        $('div#AddSupplier div.loader').hide();
    }).fail(function () {
        $('div#AddSupplier div.msg').html(errMsgNet).removeClass('success').addClass('error').fadeIn();
    });
}

And here is the code of registerSupplier() function:

function registerSupplier(dataToPost) {
    return $.ajax({
        type: "POST",
        url: jsonpath + 'Json.ashx?method=RegisterSupplier',
        data: dataToPost
    });
}

And here is the complete JS file: http://preview.myignou.com/Docs/jScript.js

Related HTML

<div id="ViewOrder">
   <h2>View Order Details</h2>
   <div class="tab-content">
      <table class="frm">
         <tr>
            <td><label>Enter Order Number</label></td>
            <td><input type="text" name="orderNumber" onkeyup="$('#ViewOrder>div>div').fadeOut();" /><input type="button" class="but1 m-side" value="OK" onclick="LoadMaterialOrder();"/></td>
            <td>
               <div class="process">&nbsp;</div>
            </td>
         </tr>
      </table>
      <div>
         <div class="border shadow m-tb">
            <h2 class="header">Order Details</h2>
            <div id="orderDetails" class="tab-content">
               <table class="frm">
                  <tr>
                     <td><label>Supplier</label></td>
                     <td><select id="newSupplier" name="supplier"></select></td>
                     <td class="r-align"><input type="button" value="Load Suppliers" onclick="loadSuppliers('#newSupplier')" /></td>
                  </tr>
                  <tr>
                     <td><label>Order Date</label></td>
                     <td><input type="text" name="orderDate" /></td>
                  </tr>
                  <tr>
                     <td><label>Delivery Date</label></td>
                     <td><input type="text" name="deliveryDate" /></td>
                  </tr>
                  <tr>
                     <td><label>Cancel Date</label></td>
                     <td><input type="text" name="cancelDate" /></td>
                  </tr>
                  <tr>
                     <td><label>Payment Due Mark</label></td>
                     <td><input id="payDue2" type="checkbox" name="isPayDue" /><label for="payDue2">Yes</label></td>
                  </tr>
                  <tr>
                     <td><label>Remember Mark</label></td>
                     <td><input id="remark2" type="checkbox" name="isMarked" /><label for="remark2">Yes</label></td>
                  </tr>
               </table>
            </div>
            <table class="footer-buttons">
               <tr>
                  <td>
                     <div class="msg"></div>
                     <div class="loader" style="display:none;"><img alt="loader" src="CSS/Images/loader.gif" /></div>
                  </td>
                  <td><input type="button" class="but1 sub-but" value="Save Changes" onclick=""/><input type="reset" value="Reset" /></td>
               </tr>
            </table>
         </div>
         <br />
         <div class="border shadow m-tb">
            <h2 class="header">Payment Records</h2>
            <div id="paymentHistory" class="tab-content">
               <table class="tab pay-his">
                  <tr class="th">
                     <td></td>
                     <td>Trans#</td>
                     <td>Date</td>
                     <td>Comment</td>
                     <td>Type</td>
                     <td>Credit</td>
                     <td>Debit</td>
                     <td>Balance</td>
                     <td>Associated Agent</td>
                  </tr>
                  <tr>
                     <td><input type="radio" name="paySelect" /></td>
                     <td>101-1</td>
                     <td>12-12-12</td>
                     <td>Abclk lask aa</td>
                     <td>Credit</td>
                     <td>500</td>
                     <td></td>
                     <td>500.00</td>
                     <td>Shashwat Tripathi</td>
                  </tr>
                  <tr>
                     <td><input type="radio" name="paySelect" /></td>
                     <td>101-2</td>
                     <td>12-12-12</td>
                     <td>Shashwat Tripathi</td>
                     <td>Debit</td>
                     <td></td>
                     <td>500</td>
                     <td>500.00</td>
                     <td>Sudhir</td>
                  </tr>
                  <tr>
                     <td><input type="radio" name="paySelect" /></td>
                     <td>101-3</td>
                     <td>12-12-12</td>
                     <td>Shashwat Tripathi</td>
                     <td>Credit</td>
                     <td>500</td>
                     <td></td>
                     <td>500.00</td>
                     <td>Sudhir Gaur</td>
                  </tr>
               </table>
               <br />
               <input type="button" class="but2" value="Edit" 
                  onclick="$('#ViewOrder #payEdit').slideDown(function () { $('html, body').animate({ scrollTop: $('#paymentHistory').offset().top-20 }, 500); });" /><input type="button" class="but2 m-side" value="Delete" />
               <div id="payEdit" class="border m-tb shadow" style="display:none;">
                  <h2 class="header">Edit Payment</h2>
                  <div class="tab-content">
                     <table class="frm">
                        <tr>
                           <td><label>Date</label></td>
                           <td><input type="text" name="date" placeholder="dd-mm-yy"/></td>
                        </tr>
                        <tr>
                           <td><label>Type</label></td>
                           <td>
                              <select name="type">
                                 <option>Credit</option>
                                 <option>Debit</option>
                                 <option>Expense</option>
                              </select>
                           </td>
                        </tr>
                        <tr>
                           <td><label>Amount</label></td>
                           <td><input type="text" name="amount" placeholder="धनराशी..." /></td>
                        </tr>
                        <tr>
                           <td><label>Comment</label></td>
                           <td><textarea name="comment" rows="4" cols="10"></textarea></td>
                        </tr>
                        <tr>
                           <td></td>
                           <td><input type="button" class="but1" value="Save Changes" /><input type="button" class="but2 m-side" onclick="$('#payEdit').slideUp();" value="Cancel" /></td>
                        </tr>
                     </table>
                  </div>
               </div>
               <br />
               <h2>Register New Payment</h2>
               <hr />
               <div id="newMatOrderPayment">
                  <table class="frm">
                     <tr>
                        <td><label>Date</label></td>
                        <td><input type="text" name="date" placeholder="dd-mm-yy" /></td>
                     </tr>
                     <tr>
                        <td><label>Type</label></td>
                        <td>
                           <select name="type">
                              <option>Credit</option>
                              <option>Debit</option>
                              <option>Expense</option>
                           </select>
                        </td>
                     </tr>
                     <tr>
                        <td><label>Amount</label></td>
                        <td><input type="text" name="amount" placeholder="धनराशी..." /></td>
                     </tr>
                     <tr>
                        <td><label>Comment</label></td>
                        <td><textarea name="comment" rows="4" cols="10"></textarea></td>
                     </tr>
                  </table>
               </div>
            </div>
            <table class="footer-buttons">
               <tr>
                  <td>
                     <div class="msg"></div>
                     <div class="loader" style="display:none;"><img alt="loader" src="CSS/Images/loader.gif" /></div>
                  </td>
                  <td><input type="button" class="but1" value="Register Payment" onclick=""/><input type="button" class="but2" onclick="$('#NewMatOrderPayment :text').val('');" value="Reset" /></td>
               </tr>
            </table>
         </div>
      </div>
   </div>
</div>
<div id="AddSupplier">
   <h2>Register New Suppiler</h2>
   <div class="tab-content">
      <table class="frm">
         <tr>
            <td><label>Supplier ID</label></td>
            <td><input type="text" name="supId" /></td>
         </tr>
         <tr>
            <td><label>Contact Number</label></td>
            <td><input type="text" name="contact" /></td>
         </tr>
         <tr>
            <td><label>Address</label></td>
            <td><textarea name="address" cols="10" rows="4"></textarea></td>
         </tr>
         <tr>
            <td><label>Email address</label></td>
            <td><input type="text" name="email" /></td>
         </tr>
         <tr>
            <td><label>City</label></td>
            <td><input type="text" name="city" /></td>
         </tr>
      </table>
   </div>
   <table class="footer-buttons">
      <tr>
         <td>
            <div class="msg"></div>
            <div class="loader" style="display:none;"><img alt="loader" src="CSS/Images/loader.gif" /></div>
         </td>
         <td><input type="button" class="but1 sub-but" value="Register" onclick="newSupplier();"/><input type="reset" value="रीसेट" /></td>
      </tr>
   </table>
</div>

If I am calling this function directly from FF and Firebug console then It is getting called.
But on button click I am getting error TypeError: newSupplier is not a function

Please ask me If u need additional code.