Issues with rendering 2 images in one window in SDL - c++

Question

I am making a simples possible jigsaw game using SDL.
Currently i am having trouble applying image texutes to Rects that serve as a puzzle pieces.
The way I applied texture to background doesnt work for pieces(rect1-9).
All pieces are 100x100 and picture is 300x300.
Tell me what is wrong, how to do it right and also explain how to Clip render(apply only part of the texture) with SDL_RenderCopy
#include <list>
#include <SDL.h>
int main(int argc, char ** argv)
{
// variables
bool quit = false;
SDL_Event event;
bool leftMouseButtonDown = false;
SDL_Point mousePos;
SDL_Point clickOffset;
// init SDL
SDL_Init(SDL_INIT_VIDEO);
SDL_Window * window = SDL_CreateWindow("SDL2 Drag and Drop",
SDL_WINDOWPOS_UNDEFINED, SDL_WINDOWPOS_UNDEFINED, 600, 400, 0);
SDL_Renderer * renderer = SDL_CreateRenderer(window, -1, 0);
SDL_Surface* bgSurface = SDL_LoadBMP("background.bmp");
SDL_Texture* bgTexture = SDL_CreateTextureFromSurface (renderer,bgSurface);
SDL_Surface* picSurface = SDL_LoadBMP("picture.bmp");
SDL_Texture* picTexture = SDL_CreateTextureFromSurface (renderer,bgSurface);
SDL_Rect rect1 = { 52, 51, 100, 100 };
SDL_Rect rect2 = { 152, 51, 100, 100 };
SDL_Rect rect3 = { 250, 51, 100, 100 };
SDL_Rect rect4 = { 52, 151, 100, 100 };
SDL_Rect rect5 = { 152, 151, 100, 100 };
SDL_Rect rect6 = { 250, 151, 100, 100 };
SDL_Rect rect7 = { 52, 249, 100, 100 };
SDL_Rect rect8 = { 152, 249, 100, 100 };
SDL_Rect rect9 = { 250, 249, 100, 100 };
SDL_Rect background = { 0, 0, 600, 400 };
SDL_Rect * selectedRect = NULL;
std::list<SDL_Rect *> rectangles;
rectangles.push_back(&rect1);
rectangles.push_back(&rect2);
rectangles.push_back(&rect3);
rectangles.push_back(&rect4);
rectangles.push_back(&rect5);
rectangles.push_back(&rect6);
rectangles.push_back(&rect7);
rectangles.push_back(&rect8);
rectangles.push_back(&rect9);
// handle events
while (!quit)
{
SDL_Delay(10);
SDL_PollEvent(&event);
switch (event.type)
{
case SDL_QUIT:
quit = true;
break;
case SDL_MOUSEBUTTONUP:
if (leftMouseButtonDown && event.button.button == SDL_BUTTON_LEFT)
{
leftMouseButtonDown = false;
selectedRect = NULL;
}
break;
case SDL_MOUSEBUTTONDOWN:
if (!leftMouseButtonDown && event.button.button == SDL_BUTTON_LEFT)
{
leftMouseButtonDown = true;
for (auto rect : rectangles)
{
if (SDL_PointInRect(&mousePos, rect))
{
selectedRect = rect;
clickOffset.x = mousePos.x - rect->x;
clickOffset.y = mousePos.y - rect->y;
break;
}
}
}
break;
case SDL_MOUSEMOTION:
{
mousePos = { event.motion.x, event.motion.y };
if (leftMouseButtonDown && selectedRect != NULL)
{
selectedRect->x = mousePos.x - clickOffset.x;
selectedRect->y = mousePos.y - clickOffset.y;
}
}
break;
}
SDL_SetRenderDrawColor(renderer, 0, 0, 0, 255);
SDL_RenderClear(renderer);
SDL_RenderCopy(renderer,bgTexture,NULL,&background );
SDL_RenderCopy(renderer,bgTexture,NULL,&rect1 );
for (auto const& rect : rectangles)
{
if (rect == selectedRect)
SDL_SetRenderDrawColor(renderer, 255, 0, 255, 100);
else
SDL_SetRenderDrawColor(renderer, 0, 255, 0, 0);
SDL_RenderFillRect(renderer, rect);
}
SDL_RenderPresent(renderer);
}
// cleanup SDL
SDL_DestroyTexture (bgTexture);
SDL_DestroyRenderer(renderer);
SDL_DestroyWindow(window);
SDL_Quit();
return 0;
}