imageview change in listview during scrolling

Question

i have a listview contains text and imageview , this imageview implements onClickListener() for playing some media , when the user click the imageview the audio file play and the imageview play button change to pause button until this point it works so fine for me but when i scroll down to the last item in the listview the pause button returns to default buton(play button) and the audio file keeps playing .. why this is happening ? thanks a lot

  //--------------- Play Button -------------------------------------------------------------------
    b.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View arg0) {

            //--------------determine the id to play ----------------------------------
             idd = items.get(position).getId();
             FilteringNums f = new FilteringNums();
             f.convert(idd);
             String attribute   = f.r;
            //------------------------------------------------------------------------- 
                 int resourceId = arg0.getResources().getIdentifier(attribute+position, "raw", activity.getPackageName());
                 final MediaPlayer Mp =MediaPlayer.create(getContext(), resourceId);
            try{        
                 int r = Mp.getCurrentPosition();
                 Mp.seekTo(r);
                 Mp.start();                

             b.setEnabled(false);
             b.setVisibility(b.INVISIBLE);
             pause.setVisibility(pause.VISIBLE);
  //------------------------------------------------------------------------------------------------

            //-------------- Pause Button ---------------------------------------------------------
             pause.setOnClickListener(new View.OnClickListener() {

                @Override
                public void onClick(View arg0) {

                    if(Mp.isPlaying())
                    {
                    Mp.pause();
                     Log.d("media player", "is paused");
                    resume.setVisibility(resume.VISIBLE);
                    stop.setVisibility(stop.VISIBLE);
                    }
                }
                });

Answer 1

this the viewHolder

static class ViewHolder {
    public TextView tv_id ;
    public ImageView b;
    public ImageView pause;
    public ImageView resume;
    public ImageView stop;
}

and this the implementation of it

final ViewHolder holder = new ViewHolder();
    holder.tv_id= (TextView) convertView.findViewById(R.id.sora_id);

    holder.b= (ImageView)  convertView.findViewById(R.id.list_item_btn);
    holder.pause= (ImageView)  convertView.findViewById(R.id.pause_item_btn);
    holder.resume= (ImageView)  convertView.findViewById(R.id.resume_item_btn);
    holder.stop= (ImageView)  convertView.findViewById(R.id.stop_item_btn);
    if (position % 2 == 0 )
        holder.tv_id.setText("سورة"+" "+items.get(position).getSora().toString());
    else
        holder.tv_id.setText(items.get(position).getSora().toString()); 
    holder.tv_id.setTextColor(colors2[colorPos2]);
    holder.tv_id.setTypeface(null, Typeface.BOLD);
    holder.b.setBackgroundResource(R.drawable.speaker);
    holder.pause.setBackgroundResource(R.drawable.pause);
    holder.resume.setBackgroundResource(R.drawable.play);
    holder.stop.setBackgroundResource(R.drawable.stop);