jQueryでタブ切り替え時にタブボタンの画像を切り替えたい

前提・実現したいこと

サイドバーにタブを複数作っていてそれぞれのタブをクリックしたら背景画像を変更したいです。

発生している問題・エラーメッセージ

タブを切り替えて背景画像を変えることはできたのですがタブをクリック→画像変更→タブがリンクになっているため更新されてクリック前の状態に戻る。

できる限りタブはリンクを埋め込みたいです。

もしかしたらもっと簡単なやり方があるかもしれません、もし違うやり方のほうがよかったらやり直します。

該当のソースコード

js
1$(function() {
2
3	$('.tab a').click(function() {
4
5		var index = $('.tab a').index(this);
6
7		$('.tab a').removeClass('select');
8
9		$(this).addClass('select');
10
11
12	});
13});

html
1<div class="tab">
2  <a  class="1" id="1-img">
3  <a  class="2" id="2-img">
4  <a  class="3" id="3-img">
5</div>

css
1#1-img {
2	background-image: url("../img/base_img/1_img.png");
3	height:45px;
4}
5#2-img {
6	background-image: url("../img/base_img/2_img.png");
7	height:45px;
8}
9#3-img {
10	background-image: url("../img/base_img/3_img.png");
11	height:45px;
12}
13
14
15.tab{overflow:hidden;}
16.tab a {
17	float:left;	
18	height: 45px;
19	width:190px;
20}
21.tab a.select{
22	position: relative;
23	background-image: url("../img/base_img/select.png")
24}